npm - @sparrowengg/integrations-templates-frontend - Versions diffs - 8.0.13-Beta → 8.0.15-Beta - Mend

@sparrowengg/integrations-templates-frontend 8.0.13-Beta → 8.0.15-Beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (934) hide show

package/README.md CHANGED Viewed

@@ -75,6 +75,8 @@ The Mapping component provides a comprehensive interface for mapping survey fiel
 | `onDeleteHandler` | `(id: string \| number) => void` | ❌ | Delete field handler |
 | `draftHandler` | `(type: string \| null, editFieldId?: string \| number) => void` | ✅ | Draft save handler |
 | `configuration` | `ConfigurationObject` | ✅ | Configuration setup object |
+| `customTypeOptions` | `Record<string, any[] \| { type: SelectOption; options: any[] }>` | ❌ | Custom mapping types and their field options |
+| `disabledMappingTypes` | `string[]` | ❌ | Array of type values to hide from dropdown |
 #### FieldType
@@ -623,6 +625,59 @@ Most components support loading states for async operations:
 />
 ```
+## 🎨 Custom Type Options
+The Mapping component supports dynamic custom mapping types through the `customTypeOptions` prop. This allows integration-specific field types without modifying core constants.
+### Basic Usage
+```tsx
+<Mapping
+  customTypeOptions={{
+    'EMAIL_SHARE_PROPERTY': {
+      type: {
+        label: 'Email Share Property',
+        value: 'EMAIL_SHARE_PROPERTY',
+      },
+      options: [
+        {
+          value: 'success',
+          label: 'Is Email sent?',
+          fieldType: 'Property',
+          id: 'success',
+          description: 'Is Email sent?',
+        },
+        {
+          value: 'sentAt',
+          label: 'Email sent at',
+          fieldType: 'Property',
+          id: 'sentAt',
+          description: 'Email sent at',
+        },
+      ]
+    },
+  }}
+/>
+```
+### With Type Filtering
+```tsx
+<Mapping
+  customTypeOptions={{...}}
+  disabledMappingTypes={['QUESTION']} // Hide Question type
+/>
+```
+### Custom Type Structure
+Each custom type requires:
+- `type.label`: Display name in Type dropdown
+- `type.value`: Unique identifier
+- `options`: Array of field options available for this type
+For detailed documentation on custom types, see [CUSTOM_TYPE_OPTIONS.md](./CUSTOM_TYPE_OPTIONS.md).
 ## 🤝 TypeScript Support
 The library is built with TypeScript and provides comprehensive type definitions for all components and props. Import types as needed:

package/dist/cjs/commons/components/NamingModal.js CHANGED Viewed

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
+var testId_context = require('../context/test-id.context.js');
 var dialog = require('../../node_modules/@sparrowengg/twigs-react/dist/es/dialog/dialog.js');
 var flex = require('../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
 var formInput = require('../../node_modules/@sparrowengg/twigs-react/dist/es/input/form-input.js');
@@ -25,6 +26,7 @@ function NamingModal({
   updateLabel = "Update Mapping",
   saveDisabled = false
 }) {
+  const { tid } = testId_context.useTestId();
   return /* @__PURE__ */ React.createElement(dialog.Dialog, { open: isOpen, size: "sm" }, /* @__PURE__ */ React.createElement(dialog.DialogContent, null, /* @__PURE__ */ React.createElement(
     dialog.DialogHeader,
     {
@@ -68,7 +70,8 @@ function NamingModal({
         css: {
           width: "100%"
         },
-        onClick: saveHandler
+        onClick: saveHandler,
+        "data-testid": tid("save-name")
       },
       editFieldId ? updateLabel : saveLabel
     )
@@ -79,7 +82,8 @@ function NamingModal({
       icon: /* @__PURE__ */ React.createElement(close.CloseIcon, null),
       variant: "ghost",
       "aria-label": "Close",
-      color: "default"
+      color: "default",
+      "data-testid": tid("close-modal")
     }
   )))));
 }

package/dist/cjs/commons/components/NamingModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NamingModal.js","sources":["../../../../src/commons/components/NamingModal.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n Dialog,\n DialogHeader,\n DialogTitle,\n DialogBody,\n DialogFooter,\n DialogClose,\n DialogTrigger,\n DialogContent,\n IconButton,\n Box,\n Button,\n Flex,\n FormInput,\n} from \"@sparrowengg/twigs-react\";\nimport { CloseIcon } from \"@sparrowengg/twigs-react-icons\";\n\nexport default function NamingModal({\n editFieldId,\n mappingLoader = false,\n saveHandler,\n closeHandler,\n value,\n setValue,\n isOpen,\n title = \"Mapping Name\",\n placeholder = \"Enter a name for future reference\",\n saveLabel = \"Save Mapping\",\n updateLabel = \"Update Mapping\",\n saveDisabled = false,\n}: {\n editFieldId: string \| number \| undefined;\n mappingLoader?: boolean;\n saveHandler: () => void;\n closeHandler: () => void;\n value: string;\n setValue: (value: string) => void;\n isOpen: boolean;\n /** Dialog title. Defaults to \"Mapping Name\" to preserve existing behavior. /\n title?: string;\n /* Input placeholder. Defaults to the original mapping placeholder text. /\n placeholder?: string;\n /* Save button label (create mode). Defaults to \"Save Mapping\". /\n saveLabel?: string;\n /* Save button label (edit mode). Defaults to \"Update Mapping\". /\n updateLabel?: string;\n /\n Disables the Save/Update button. Defaults to false to preserve existing\n * behavior; opt-in callers use it to block updates when nothing changed.\n */\n saveDisabled?: boolean;\n}) {\n return (\n <Dialog open={isOpen} size=\"sm\">\n <DialogContent>\n <DialogHeader\n css={{\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n justifyContent: \"center\",\n borderBottom: \"none !important\",\n }}\n >\n <DialogTitle size=\"lg\">{title}</DialogTitle>\n </DialogHeader>\n <DialogBody css={{\n paddingInline: '$12',\n paddingTop: '0 !important',\n paddingBottom: '$8',\n }}>\n <Flex flexDirection=\"column\" gap=\"$2\" css={{ marginBottom: \"$2\" }}>\n <FormInput\n size=\"lg\"\n id=\"name\"\n value={value}\n onChange={(e) => setValue(e.target.value)}\n maxLength={50}\n placeholder={placeholder}\n />\n </Flex>\n </DialogBody>\n <DialogFooter>\n <Flex\n css={{\n width: \"100%\",\n }}\n >\n <Button\n loading={mappingLoader}\n size=\"lg\"\n color=\"primary\"\n disabled={saveDisabled}\n css={{\n width: \"100%\",\n }}\n onClick={saveHandler}\n >\n {editFieldId ? updateLabel : saveLabel}\n </Button>\n </Flex>\n </DialogFooter>\n <Box css={{ position: \"absolute\", top: \"$8\", right: \"$8\" }}>\n <DialogClose asChild onClick={closeHandler}>\n <IconButton\n size=\"lg\"\n icon={<CloseIcon />}\n variant=\"ghost\"\n aria-label=\"Close\"\n color=\"default\"\n />\n </DialogClose>\n </Box>\n </DialogContent>\n </Dialog>\n );\n}\n"],"names":["Dialog","DialogContent","DialogHeader","DialogTitle","DialogBody","Flex","FormInput","DialogFooter","Button","Box","DialogClose","IconButton","CloseIcon"],"mappings":"~~;;;;;;;;;;;;;AAkBA~~,SAAwB,WAAA,CAAY;AAAA,EAClC,WAAA;AAAA,EACA,aAAA,GAAgB,KAAA;AAAA,EAChB,WAAA;AAAA,EACA,YAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA,GAAQ,cAAA;AAAA,EACR,WAAA,GAAc,mCAAA;AAAA,EACd,SAAA,GAAY,cAAA;AAAA,EACZ,WAAA,GAAc,gBAAA;AAAA,EACd,YAAA,GAAe;AACjB,CAAA,EAqBG;AACD,EAAA,~~2CACGA~~,aAAA,EAAA,EAAO,IAAA,EAAM,QAAQ,IAAA,EAAK,IAAA,EAAA,sCACxBC,oBAAA,EAAA,IAAA,kBACC,KAAA,CAAA,aAAA;AAAA,IAACC,mBAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK;AAAA,QACH,OAAA,EAAS,MAAA;AAAA,QACT,aAAA,EAAe,QAAA;AAAA,QACf,UAAA,EAAY,YAAA;AAAA,QACZ,cAAA,EAAgB,QAAA;AAAA,QAChB,YAAA,EAAc;AAAA;AAChB,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAACC,kBAAA,EAAA,EAAY,IAAA,EAAK,IAAA,EAAA,EAAM,KAAM;AAAA,GAChC,kBACA,KAAA,CAAA,aAAA,CAACC,iBAAA,EAAA,EAAW,GAAA,EAAK;AAAA,IACb,aAAA,EAAe,KAAA;AAAA,IACf,UAAA,EAAY,cAAA;AAAA,IACZ,aAAA,EAAe;AAAA,GACnB,EAAA,kBACE,KAAA,CAAA,aAAA,CAACC,SAAA,EAAA,EAAK,aAAA,EAAc,QAAA,EAAS,GAAA,EAAI,IAAA,EAAK,GAAA,EAAK,EAAE,YAAA,EAAc,IAAA,EAAK,EAAA,kBAC9D,KAAA,CAAA,aAAA;AAAA,IAACC,mBAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,IAAA;AAAA,MACL,EAAA,EAAG,MAAA;AAAA,MACH,KAAA;AAAA,MACA,UAAU,CAAC,CAAA,KAAM,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,MACxC,SAAA,EAAW,EAAA;AAAA,MACX;AAAA;AAAA,GAEJ,CACF,CAAA,kBACA,KAAA,CAAA,aAAA,CAACC,mBAAA,EAAA,IAAA,kBACC,KAAA,CAAA,aAAA;AAAA,IAACF,SAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK;AAAA,QACH,KAAA,EAAO;AAAA;AACT,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACG,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,aAAA;AAAA,QACT,IAAA,EAAK,IAAA;AAAA,QACL,KAAA,EAAM,SAAA;AAAA,QACN,QAAA,EAAU,YAAA;AAAA,QACV,GAAA,EAAK;AAAA,UACH,KAAA,EAAO;AAAA,SACT;AAAA,QACA,OAAA,EAAS;AAAA,OAAA;AAAA,~~MAER~~,cAAc,WAAA,GAAc;AAAA;AAC/B,GAEJ,CAAA,kBACA,KAAA,CAAA,aAAA,CAACC,WAAI,GAAA,EAAK,EAAE,UAAU,UAAA,EAAY,GAAA,EAAK,IAAA,EAAM,KAAA,EAAO,MAAK,EAAA,kBACvD,KAAA,CAAA,aAAA,CAACC,sBAAY,OAAA,EAAO,IAAA,EAAC,SAAS,YAAA,EAAA,kBAC5B,KAAA,CAAA,aAAA;AAAA,IAACC,qBAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,IAAA;AAAA,MACL,IAAA,sCAAOC,eAAA,EAAA,IAAU,CAAA;AAAA,MACjB,OAAA,EAAQ,OAAA;AAAA,MACR,YAAA,EAAW,OAAA;AAAA,MACX,KAAA,EAAM;AAAA;AAAA,~~GAEV~~,CACF,CACF,CACF,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"NamingModal.js","sources":["../../../../src/commons/components/NamingModal.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTestId } from \"../context/test-id.context\";\nimport {\n Dialog,\n DialogHeader,\n DialogTitle,\n DialogBody,\n DialogFooter,\n DialogClose,\n DialogTrigger,\n DialogContent,\n IconButton,\n Box,\n Button,\n Flex,\n FormInput,\n} from \"@sparrowengg/twigs-react\";\nimport { CloseIcon } from \"@sparrowengg/twigs-react-icons\";\n\nexport default function NamingModal({\n editFieldId,\n mappingLoader = false,\n saveHandler,\n closeHandler,\n value,\n setValue,\n isOpen,\n title = \"Mapping Name\",\n placeholder = \"Enter a name for future reference\",\n saveLabel = \"Save Mapping\",\n updateLabel = \"Update Mapping\",\n saveDisabled = false,\n}: {\n editFieldId: string \| number \| undefined;\n mappingLoader?: boolean;\n saveHandler: () => void;\n closeHandler: () => void;\n value: string;\n setValue: (value: string) => void;\n isOpen: boolean;\n /** Dialog title. Defaults to \"Mapping Name\" to preserve existing behavior. /\n title?: string;\n /* Input placeholder. Defaults to the original mapping placeholder text. /\n placeholder?: string;\n /* Save button label (create mode). Defaults to \"Save Mapping\". /\n saveLabel?: string;\n /* Save button label (edit mode). Defaults to \"Update Mapping\". /\n updateLabel?: string;\n /\n Disables the Save/Update button. Defaults to false to preserve existing\n * behavior; opt-in callers use it to block updates when nothing changed.\n */\n saveDisabled?: boolean;\n}) {\n const { tid } = useTestId();\n return (\n <Dialog open={isOpen} size=\"sm\">\n <DialogContent>\n <DialogHeader\n css={{\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n justifyContent: \"center\",\n borderBottom: \"none !important\",\n }}\n >\n <DialogTitle size=\"lg\">{title}</DialogTitle>\n </DialogHeader>\n <DialogBody css={{\n paddingInline: '$12',\n paddingTop: '0 !important',\n paddingBottom: '$8',\n }}>\n <Flex flexDirection=\"column\" gap=\"$2\" css={{ marginBottom: \"$2\" }}>\n <FormInput\n size=\"lg\"\n id=\"name\"\n value={value}\n onChange={(e) => setValue(e.target.value)}\n maxLength={50}\n placeholder={placeholder}\n />\n </Flex>\n </DialogBody>\n <DialogFooter>\n <Flex\n css={{\n width: \"100%\",\n }}\n >\n <Button\n loading={mappingLoader}\n size=\"lg\"\n color=\"primary\"\n disabled={saveDisabled}\n css={{\n width: \"100%\",\n }}\n onClick={saveHandler}\n data-testid={tid('save-name')}\n >\n {editFieldId ? updateLabel : saveLabel}\n </Button>\n </Flex>\n </DialogFooter>\n <Box css={{ position: \"absolute\", top: \"$8\", right: \"$8\" }}>\n <DialogClose asChild onClick={closeHandler}>\n <IconButton\n size=\"lg\"\n icon={<CloseIcon />}\n variant=\"ghost\"\n aria-label=\"Close\"\n color=\"default\"\n data-testid={tid('close-modal')}\n />\n </DialogClose>\n </Box>\n </DialogContent>\n </Dialog>\n );\n}\n"],"names":["useTestId","Dialog","DialogContent","DialogHeader","DialogTitle","DialogBody","Flex","FormInput","DialogFooter","Button","Box","DialogClose","IconButton","CloseIcon"],"mappings":"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"}

package/dist/cjs/commons/components/confirmation-modal.js CHANGED Viewed

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
+var testId_context = require('../context/test-id.context.js');
 var alertDialog = require('../../node_modules/@sparrowengg/twigs-react/dist/es/alert-dialog/alert-dialog.js');
 var button = require('../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js');
@@ -12,6 +13,7 @@ const ConfirmationModal = ({
   onConfirm,
   onCancel
 }) => {
+  const { tid } = testId_context.useTestId();
   const [isDeleteIconHover, setIsDeleteIconHover] = React.useState(false);
   return /* @__PURE__ */ React.createElement(alertDialog.AlertDialog, { open: true }, /* @__PURE__ */ React.createElement(
     alertDialog.AlertDialogContent,
@@ -52,14 +54,15 @@ const ConfirmationModal = ({
       },
       description
     ),
-    /* @__PURE__ */ React.createElement(alertDialog.AlertDialogActions, { css: { gap: "$6" } }, /* @__PURE__ */ React.createElement(alertDialog.AlertDialogCancel, { asChild: true, onClick: onCancel }, /* @__PURE__ */ React.createElement(button.Button, { color: "default", variant: "solid", size: "lg" }, "Cancel")), /* @__PURE__ */ React.createElement(alertDialog.AlertDialogAction, { asChild: true }, /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React.createElement(alertDialog.AlertDialogActions, { css: { gap: "$6" } }, /* @__PURE__ */ React.createElement(alertDialog.AlertDialogCancel, { asChild: true, onClick: onCancel }, /* @__PURE__ */ React.createElement(button.Button, { color: "default", variant: "solid", size: "lg", "data-testid": tid("cancel-btn") }, "Cancel")), /* @__PURE__ */ React.createElement(alertDialog.AlertDialogAction, { asChild: true }, /* @__PURE__ */ React.createElement(
       button.Button,
       {
         onMouseEnter: () => setIsDeleteIconHover(true),
         onMouseLeave: () => setIsDeleteIconHover(false),
         color: isDeleteIconHover ? "error" : "default",
         size: "lg",
-        onClick: onConfirm
+        onClick: onConfirm,
+        "data-testid": tid("confirm-btn")
       },
       "Confirm"
     )))

package/dist/cjs/commons/components/confirmation-modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"confirmation-modal.js","sources":["../../../../src/commons/components/confirmation-modal.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { AlertDialog,\n AlertDialogContent,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogActions,\n AlertDialogCancel,\n AlertDialogAction,\n Button, } from \"@sparrowengg/twigs-react\";\ntype ConfirmationModalProps = {\n name: string;\n description: string;\n onConfirm: () => void \| Promise<void>;\n onCancel: () => void;\n};\nconst ConfirmationModal: React.FC<ConfirmationModalProps> = ({\n name,\n description,\n onConfirm,\n onCancel\n}) => {\n const [isDeleteIconHover, setIsDeleteIconHover] = useState(false);\n return <AlertDialog open={true}>\n <AlertDialogContent\n onOpenAutoFocus={(e) => e.preventDefault()}\n className=\"dm-sans\"\n css={{\n button: {\n borderRadius: '8px',\n },\n }}\n >\n <AlertDialogTitle\n css={{\n display: 'flex',\n justifyContent: 'space-between',\n border: 'none !important',\n padding: '24px $12 8px $12 !important',\n }}\n >\n {name}\n </AlertDialogTitle>\n\n <AlertDialogDescription\n css={{\n overflowWrap: 'break-word',\n padding: '0px $12 0px $12 !important',\n fontSize: '$sm',\n fontWeight: '400',\n lineHeight: '20px',\n letterSpacing: '0px',\n color: '$neutral800',\n margin: '0 !important',\n }}\n >\n {description}\n </AlertDialogDescription>\n\n <AlertDialogActions css={{ gap: '$6' }}>\n <AlertDialogCancel asChild onClick={onCancel}>\n <Button color=\"default\" variant=\"solid\" size=\"lg\">\n Cancel\n </Button>\n </AlertDialogCancel>\n\n <AlertDialogAction asChild>\n <Button\n onMouseEnter={() => setIsDeleteIconHover(true)}\n onMouseLeave={() => setIsDeleteIconHover(false)}\n color={isDeleteIconHover ? 'error' : 'default'}\n size=\"lg\"\n onClick={onConfirm}\n >\n Confirm\n </Button>\n </AlertDialogAction>\n </AlertDialogActions>\n </AlertDialogContent>\n </AlertDialog>\n};\nexport default ConfirmationModal;\n"],"names":["useState","AlertDialog","AlertDialogContent","AlertDialogTitle","AlertDialogDescription","AlertDialogActions","AlertDialogCancel","Button","AlertDialogAction"],"mappings":"~~;;;;;;;;AAeA~~,MAAM,oBAAsD,CAAC;AAAA,EACzD,IAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA;AACJ,CAAA,KAAM;AACF,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,~~GAAIA~~,eAAS,KAAK,CAAA;AAChE,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAACC,uBAAA,EAAA,EAAY,IAAA,EAAM,IAAA,EAAA,kBAC3B,KAAA,CAAA,aAAA;AAAA,IAACC,8BAAA;AAAA,IAAA;AAAA,MACC,eAAA,EAAiB,CAAC,CAAA,KAAM,CAAA,CAAE,cAAA,EAAe;AAAA,MACzC,SAAA,EAAU,SAAA;AAAA,MACV,GAAA,EAAK;AAAA,QACH,MAAA,EAAQ;AAAA,UACN,YAAA,EAAc;AAAA;AAChB;AACF,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,4BAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,OAAA,EAAS,MAAA;AAAA,UACT,cAAA,EAAgB,eAAA;AAAA,UAChB,MAAA,EAAQ,iBAAA;AAAA,UACR,OAAA,EAAS;AAAA;AACX,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,kCAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,YAAA,EAAc,YAAA;AAAA,UACd,OAAA,EAAS,4BAAA;AAAA,UACT,QAAA,EAAU,KAAA;AAAA,UACV,UAAA,EAAY,KAAA;AAAA,UACZ,UAAA,EAAY,MAAA;AAAA,UACZ,aAAA,EAAe,KAAA;AAAA,UACf,KAAA,EAAO,aAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AACV,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA,CAACC,8BAAA,EAAA,EAAmB,GAAA,EAAK,EAAE,GAAA,EAAK,IAAA,EAAK,EAAA,kBACnC,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,OAAA,EAAO,IAAA,EAAC,OAAA,EAAS,~~QAAA~~,~~EAAA,kBAClC,~~KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAO,KAAA,EAAM,SAAA,EAAU,OAAA,EAAQ,OAAA,EAAQ,IAAA,EAAK,IAAA,EAAA,~~EAAK~~,~~QAElD~~,CACF,CAAA,kBAEA,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,~~OAAA~~,~~EAAO,~~IAAA,EAAA,kBACxB,KAAA,CAAA,aAAA;AAAA,MAACD,aAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAc,MAAM,oBAAA,CAAqB,IAAI,CAAA;AAAA,QAC7C,YAAA,EAAc,MAAM,oBAAA,CAAqB,KAAK,CAAA;AAAA,QAC9C,KAAA,EAAO,oBAAoB,OAAA,GAAU,SAAA;AAAA,QACrC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS;AAAA,OAAA;AAAA,~~MACV~~;AAAA,KAGH,CACF;AAAA,GAEJ,CAAA;AACF;;;;"}
1	+ {"version":3,"file":"confirmation-modal.js","sources":["../../../../src/commons/components/confirmation-modal.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { useTestId } from \"../context/test-id.context\";\nimport { AlertDialog,\n AlertDialogContent,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogActions,\n AlertDialogCancel,\n AlertDialogAction,\n Button, } from \"@sparrowengg/twigs-react\";\ntype ConfirmationModalProps = {\n name: string;\n description: string;\n onConfirm: () => void \| Promise<void>;\n onCancel: () => void;\n};\nconst ConfirmationModal: React.FC<ConfirmationModalProps> = ({\n name,\n description,\n onConfirm,\n onCancel\n}) => {\n const { tid } = useTestId();\n const [isDeleteIconHover, setIsDeleteIconHover] = useState(false);\n return <AlertDialog open={true}>\n <AlertDialogContent\n onOpenAutoFocus={(e) => e.preventDefault()}\n className=\"dm-sans\"\n css={{\n button: {\n borderRadius: '8px',\n },\n }}\n >\n <AlertDialogTitle\n css={{\n display: 'flex',\n justifyContent: 'space-between',\n border: 'none !important',\n padding: '24px $12 8px $12 !important',\n }}\n >\n {name}\n </AlertDialogTitle>\n\n <AlertDialogDescription\n css={{\n overflowWrap: 'break-word',\n padding: '0px $12 0px $12 !important',\n fontSize: '$sm',\n fontWeight: '400',\n lineHeight: '20px',\n letterSpacing: '0px',\n color: '$neutral800',\n margin: '0 !important',\n }}\n >\n {description}\n </AlertDialogDescription>\n\n <AlertDialogActions css={{ gap: '$6' }}>\n <AlertDialogCancel asChild onClick={onCancel}>\n <Button color=\"default\" variant=\"solid\" size=\"lg\" data-testid={tid('cancel-btn')}>\n Cancel\n </Button>\n </AlertDialogCancel>\n\n <AlertDialogAction asChild>\n <Button\n onMouseEnter={() => setIsDeleteIconHover(true)}\n onMouseLeave={() => setIsDeleteIconHover(false)}\n color={isDeleteIconHover ? 'error' : 'default'}\n size=\"lg\"\n onClick={onConfirm}\n data-testid={tid('confirm-btn')}\n >\n Confirm\n </Button>\n </AlertDialogAction>\n </AlertDialogActions>\n </AlertDialogContent>\n </AlertDialog>\n};\nexport default ConfirmationModal;\n"],"names":["useTestId","useState","AlertDialog","AlertDialogContent","AlertDialogTitle","AlertDialogDescription","AlertDialogActions","AlertDialogCancel","Button","AlertDialogAction"],"mappings":";;;;;;;;;AAgBA,MAAM,oBAAsD,CAAC;AAAA,EACzD,IAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA;AACJ,CAAA,KAAM;AACF,EAAA,MAAM,EAAE,GAAA,EAAI,GAAIA,wBAAA,EAAU;AAC1B,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAIC,eAAS,KAAK,CAAA;AAChE,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAACC,uBAAA,EAAA,EAAY,IAAA,EAAM,IAAA,EAAA,kBAC3B,KAAA,CAAA,aAAA;AAAA,IAACC,8BAAA;AAAA,IAAA;AAAA,MACC,eAAA,EAAiB,CAAC,CAAA,KAAM,CAAA,CAAE,cAAA,EAAe;AAAA,MACzC,SAAA,EAAU,SAAA;AAAA,MACV,GAAA,EAAK;AAAA,QACH,MAAA,EAAQ;AAAA,UACN,YAAA,EAAc;AAAA;AAChB;AACF,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,4BAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,OAAA,EAAS,MAAA;AAAA,UACT,cAAA,EAAgB,eAAA;AAAA,UAChB,MAAA,EAAQ,iBAAA;AAAA,UACR,OAAA,EAAS;AAAA;AACX,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,kCAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,YAAA,EAAc,YAAA;AAAA,UACd,OAAA,EAAS,4BAAA;AAAA,UACT,QAAA,EAAU,KAAA;AAAA,UACV,UAAA,EAAY,KAAA;AAAA,UACZ,UAAA,EAAY,MAAA;AAAA,UACZ,aAAA,EAAe,KAAA;AAAA,UACf,KAAA,EAAO,aAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AACV,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA,CAACC,8BAAA,EAAA,EAAmB,GAAA,EAAK,EAAE,GAAA,EAAK,IAAA,EAAK,EAAA,kBACnC,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,OAAA,EAAO,IAAA,EAAC,OAAA,EAAS,4BAClC,KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAO,KAAA,EAAM,SAAA,EAAU,OAAA,EAAQ,OAAA,EAAQ,IAAA,EAAK,IAAA,EAAK,eAAa,GAAA,CAAI,YAAY,CAAA,EAAA,EAAG,QAElF,CACF,CAAA,kBAEA,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,SAAO,IAAA,EAAA,kBACxB,KAAA,CAAA,aAAA;AAAA,MAACD,aAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAc,MAAM,oBAAA,CAAqB,IAAI,CAAA;AAAA,QAC7C,YAAA,EAAc,MAAM,oBAAA,CAAqB,KAAK,CAAA;AAAA,QAC9C,KAAA,EAAO,oBAAoB,OAAA,GAAU,SAAA;AAAA,QACrC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,SAAA;AAAA,QACT,aAAA,EAAa,IAAI,aAAa;AAAA,OAAA;AAAA,MAC/B;AAAA,KAGH,CACF;AAAA,GAEJ,CAAA;AACF;;;;"}

package/dist/cjs/commons/components/edit-confirmation.js CHANGED Viewed

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
+var testId_context = require('../context/test-id.context.js');
 var alertDialog = require('../../node_modules/@sparrowengg/twigs-react/dist/es/alert-dialog/alert-dialog.js');
 var button = require('../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js');
@@ -12,6 +13,7 @@ const EditConfirmation = ({
   onConfirm,
   onCancel
 }) => {
+  const { tid } = testId_context.useTestId();
   const [isDeleteIconHover, setIsDeleteIconHover] = React.useState(false);
   const [isLoading, setIsLoading] = React.useState(false);
   return /* @__PURE__ */ React.createElement(alertDialog.AlertDialog, { open: true }, /* @__PURE__ */ React.createElement(
@@ -53,7 +55,7 @@ const EditConfirmation = ({
       },
       description
     ),
-    /* @__PURE__ */ React.createElement(alertDialog.AlertDialogActions, { css: { gap: "$6" } }, /* @__PURE__ */ React.createElement(alertDialog.AlertDialogCancel, { asChild: true, onClick: onCancel }, /* @__PURE__ */ React.createElement(button.Button, { color: "default", variant: "solid", size: "lg" }, "Cancel")), /* @__PURE__ */ React.createElement(alertDialog.AlertDialogAction, { asChild: true }, /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React.createElement(alertDialog.AlertDialogActions, { css: { gap: "$6" } }, /* @__PURE__ */ React.createElement(alertDialog.AlertDialogCancel, { asChild: true, onClick: onCancel }, /* @__PURE__ */ React.createElement(button.Button, { color: "default", variant: "solid", size: "lg", "data-testid": tid("cancel-edit") }, "Cancel")), /* @__PURE__ */ React.createElement(alertDialog.AlertDialogAction, { asChild: true }, /* @__PURE__ */ React.createElement(
       button.Button,
       {
         loading: isLoading,
@@ -65,7 +67,8 @@ const EditConfirmation = ({
           setIsLoading(true);
           await onConfirm();
           setIsLoading(false);
-        }
+        },
+        "data-testid": tid("confirm-edit")
       },
       "Confirm"
     )))

package/dist/cjs/commons/components/edit-confirmation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"edit-confirmation.js","sources":["../../../../src/commons/components/edit-confirmation.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport {\n AlertDialog,\n AlertDialogContent,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogActions,\n AlertDialogCancel,\n AlertDialogAction,\n Button,\n} from \"@sparrowengg/twigs-react\";\ntype ConfirmationModalProps = {\n name: string;\n description: string;\n onConfirm: () => void \| Promise<void>;\n onCancel: () => void;\n};\nconst EditConfirmation: React.FC<ConfirmationModalProps> = ({\n name,\n description,\n onConfirm,\n onCancel,\n}) => {\n const [isDeleteIconHover, setIsDeleteIconHover] = useState(false);\n const [isLoading, setIsLoading] = useState(false);\n return (\n <AlertDialog open={true}>\n <AlertDialogContent\n onOpenAutoFocus={(e) => e.preventDefault()}\n className=\"dm-sans\"\n css={{\n button: {\n borderRadius: \"8px\",\n },\n }}\n >\n <AlertDialogTitle\n css={{\n display: \"flex\",\n justifyContent: \"space-between\",\n border: \"none !important\",\n padding: \"24px $12 8px $12 !important\",\n }}\n >\n {name}\n </AlertDialogTitle>\n\n <AlertDialogDescription\n css={{\n overflowWrap: \"break-word\",\n padding: \"0px $12 0px $12 !important\",\n fontSize: \"$sm\",\n fontWeight: \"400\",\n lineHeight: \"20px\",\n letterSpacing: \"0px\",\n color: \"$neutral800\",\n margin: \"0 !important\",\n }}\n >\n {description}\n </AlertDialogDescription>\n\n <AlertDialogActions css={{ gap: \"$6\" }}>\n <AlertDialogCancel asChild onClick={onCancel}>\n <Button color=\"default\" variant=\"solid\" size=\"lg\">\n Cancel\n </Button>\n </AlertDialogCancel>\n\n <AlertDialogAction asChild>\n <Button\n loading={isLoading}\n onMouseEnter={() => setIsDeleteIconHover(true)}\n onMouseLeave={() => setIsDeleteIconHover(false)}\n color={isDeleteIconHover ? \"secondary\" : \"default\"}\n size=\"lg\"\n onClick={async () => {\n setIsLoading(true)\n await onConfirm()\n setIsLoading(false)\n }}\n >\n Confirm\n </Button>\n </AlertDialogAction>\n </AlertDialogActions>\n </AlertDialogContent>\n </AlertDialog>\n );\n};\nexport default EditConfirmation;\n"],"names":["useState","AlertDialog","AlertDialogContent","AlertDialogTitle","AlertDialogDescription","AlertDialogActions","AlertDialogCancel","Button","AlertDialogAction"],"mappings":"~~;;;;;;;;AAiBA~~,MAAM,mBAAqD,CAAC;AAAA,EAC1D,IAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,~~GAAIA~~,eAAS,KAAK,CAAA;AAChE,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,eAAS,KAAK,CAAA;AAChD,EAAA,uBACE,KAAA,CAAA,aAAA,CAACC,uBAAA,EAAA,EAAY,IAAA,EAAM,IAAA,EAAA,kBACjB,KAAA,CAAA,aAAA;AAAA,IAACC,8BAAA;AAAA,IAAA;AAAA,MACC,eAAA,EAAiB,CAAC,CAAA,KAAM,CAAA,CAAE,cAAA,EAAe;AAAA,MACzC,SAAA,EAAU,SAAA;AAAA,MACV,GAAA,EAAK;AAAA,QACH,MAAA,EAAQ;AAAA,UACN,YAAA,EAAc;AAAA;AAChB;AACF,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,4BAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,OAAA,EAAS,MAAA;AAAA,UACT,cAAA,EAAgB,eAAA;AAAA,UAChB,MAAA,EAAQ,iBAAA;AAAA,UACR,OAAA,EAAS;AAAA;AACX,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,kCAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,YAAA,EAAc,YAAA;AAAA,UACd,OAAA,EAAS,4BAAA;AAAA,UACT,QAAA,EAAU,KAAA;AAAA,UACV,UAAA,EAAY,KAAA;AAAA,UACZ,UAAA,EAAY,MAAA;AAAA,UACZ,aAAA,EAAe,KAAA;AAAA,UACf,KAAA,EAAO,aAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AACV,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA,CAACC,8BAAA,EAAA,EAAmB,GAAA,EAAK,EAAE,GAAA,EAAK,IAAA,EAAK,EAAA,kBACnC,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,OAAA,EAAO,IAAA,EAAC,OAAA,EAAS,~~QAAA~~,~~EAAA,kBAClC,~~KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAO,KAAA,EAAM,SAAA,EAAU,OAAA,EAAQ,OAAA,EAAQ,IAAA,EAAK,IAAA,EAAA,~~EAAK~~,~~QAElD~~,CACF,CAAA,kBAEA,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,~~OAAA~~,~~EAAO,~~IAAA,EAAA,kBACxB,KAAA,CAAA,aAAA;AAAA,MAACD,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,SAAA;AAAA,QACT,YAAA,EAAc,MAAM,oBAAA,CAAqB,IAAI,CAAA;AAAA,QAC7C,YAAA,EAAc,MAAM,oBAAA,CAAqB,KAAK,CAAA;AAAA,QAC9C,KAAA,EAAO,oBAAoB,WAAA,GAAc,SAAA;AAAA,QACzC,IAAA,EAAK,IAAA;AAAA,QACL,SAAS,YAAY;AACnB,UAAA,YAAA,CAAa,IAAI,CAAA;AACjB,UAAA,MAAM,SAAA,EAAU;AAChB,UAAA,YAAA,CAAa,KAAK,CAAA;AAAA,QACpB;AAAA,OAAA;AAAA,~~MACD~~;AAAA,KAGH,CACF;AAAA,GAEJ,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"edit-confirmation.js","sources":["../../../../src/commons/components/edit-confirmation.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { useTestId } from \"../context/test-id.context\";\nimport {\n AlertDialog,\n AlertDialogContent,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogActions,\n AlertDialogCancel,\n AlertDialogAction,\n Button,\n} from \"@sparrowengg/twigs-react\";\ntype ConfirmationModalProps = {\n name: string;\n description: string;\n onConfirm: () => void \| Promise<void>;\n onCancel: () => void;\n};\nconst EditConfirmation: React.FC<ConfirmationModalProps> = ({\n name,\n description,\n onConfirm,\n onCancel,\n}) => {\n const { tid } = useTestId();\n const [isDeleteIconHover, setIsDeleteIconHover] = useState(false);\n const [isLoading, setIsLoading] = useState(false);\n return (\n <AlertDialog open={true}>\n <AlertDialogContent\n onOpenAutoFocus={(e) => e.preventDefault()}\n className=\"dm-sans\"\n css={{\n button: {\n borderRadius: \"8px\",\n },\n }}\n >\n <AlertDialogTitle\n css={{\n display: \"flex\",\n justifyContent: \"space-between\",\n border: \"none !important\",\n padding: \"24px $12 8px $12 !important\",\n }}\n >\n {name}\n </AlertDialogTitle>\n\n <AlertDialogDescription\n css={{\n overflowWrap: \"break-word\",\n padding: \"0px $12 0px $12 !important\",\n fontSize: \"$sm\",\n fontWeight: \"400\",\n lineHeight: \"20px\",\n letterSpacing: \"0px\",\n color: \"$neutral800\",\n margin: \"0 !important\",\n }}\n >\n {description}\n </AlertDialogDescription>\n\n <AlertDialogActions css={{ gap: \"$6\" }}>\n <AlertDialogCancel asChild onClick={onCancel}>\n <Button color=\"default\" variant=\"solid\" size=\"lg\" data-testid={tid('cancel-edit')}>\n Cancel\n </Button>\n </AlertDialogCancel>\n\n <AlertDialogAction asChild>\n <Button\n loading={isLoading}\n onMouseEnter={() => setIsDeleteIconHover(true)}\n onMouseLeave={() => setIsDeleteIconHover(false)}\n color={isDeleteIconHover ? \"secondary\" : \"default\"}\n size=\"lg\"\n onClick={async () => {\n setIsLoading(true)\n await onConfirm()\n setIsLoading(false)\n }}\n data-testid={tid('confirm-edit')}\n >\n Confirm\n </Button>\n </AlertDialogAction>\n </AlertDialogActions>\n </AlertDialogContent>\n </AlertDialog>\n );\n};\nexport default EditConfirmation;\n"],"names":["useTestId","useState","AlertDialog","AlertDialogContent","AlertDialogTitle","AlertDialogDescription","AlertDialogActions","AlertDialogCancel","Button","AlertDialogAction"],"mappings":";;;;;;;;;AAkBA,MAAM,mBAAqD,CAAC;AAAA,EAC1D,IAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,EAAE,GAAA,EAAI,GAAIA,wBAAA,EAAU;AAC1B,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAIC,eAAS,KAAK,CAAA;AAChE,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,eAAS,KAAK,CAAA;AAChD,EAAA,uBACE,KAAA,CAAA,aAAA,CAACC,uBAAA,EAAA,EAAY,IAAA,EAAM,IAAA,EAAA,kBACjB,KAAA,CAAA,aAAA;AAAA,IAACC,8BAAA;AAAA,IAAA;AAAA,MACC,eAAA,EAAiB,CAAC,CAAA,KAAM,CAAA,CAAE,cAAA,EAAe;AAAA,MACzC,SAAA,EAAU,SAAA;AAAA,MACV,GAAA,EAAK;AAAA,QACH,MAAA,EAAQ;AAAA,UACN,YAAA,EAAc;AAAA;AAChB;AACF,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,4BAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,OAAA,EAAS,MAAA;AAAA,UACT,cAAA,EAAgB,eAAA;AAAA,UAChB,MAAA,EAAQ,iBAAA;AAAA,UACR,OAAA,EAAS;AAAA;AACX,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,kCAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK;AAAA,UACH,YAAA,EAAc,YAAA;AAAA,UACd,OAAA,EAAS,4BAAA;AAAA,UACT,QAAA,EAAU,KAAA;AAAA,UACV,UAAA,EAAY,KAAA;AAAA,UACZ,UAAA,EAAY,MAAA;AAAA,UACZ,aAAA,EAAe,KAAA;AAAA,UACf,KAAA,EAAO,aAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AACV,OAAA;AAAA,MAEC;AAAA,KACH;AAAA,oBAEA,KAAA,CAAA,aAAA,CAACC,8BAAA,EAAA,EAAmB,GAAA,EAAK,EAAE,GAAA,EAAK,IAAA,EAAK,EAAA,kBACnC,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,OAAA,EAAO,IAAA,EAAC,OAAA,EAAS,4BAClC,KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAO,KAAA,EAAM,SAAA,EAAU,OAAA,EAAQ,OAAA,EAAQ,IAAA,EAAK,IAAA,EAAK,eAAa,GAAA,CAAI,aAAa,CAAA,EAAA,EAAG,QAEnF,CACF,CAAA,kBAEA,KAAA,CAAA,aAAA,CAACC,6BAAA,EAAA,EAAkB,SAAO,IAAA,EAAA,kBACxB,KAAA,CAAA,aAAA;AAAA,MAACD,aAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,SAAA;AAAA,QACT,YAAA,EAAc,MAAM,oBAAA,CAAqB,IAAI,CAAA;AAAA,QAC7C,YAAA,EAAc,MAAM,oBAAA,CAAqB,KAAK,CAAA;AAAA,QAC9C,KAAA,EAAO,oBAAoB,WAAA,GAAc,SAAA;AAAA,QACzC,IAAA,EAAK,IAAA;AAAA,QACL,SAAS,YAAY;AACnB,UAAA,YAAA,CAAa,IAAI,CAAA;AACjB,UAAA,MAAM,SAAA,EAAU;AAChB,UAAA,YAAA,CAAa,KAAK,CAAA;AAAA,QACpB,CAAA;AAAA,QACA,aAAA,EAAa,IAAI,cAAc;AAAA,OAAA;AAAA,MAChC;AAAA,KAGH,CACF;AAAA,GAEJ,CAAA;AAEJ;;;;"}

package/dist/cjs/commons/components/mapping-conditions/index.js CHANGED Viewed

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var ReactDOM = require('react-dom');
+var testId_context = require('../../context/test-id.context.js');
 var uiStrings = require('./constants/ui-strings.js');
 require('./constants/options.js');
 require('../../../cascader-dropdown/use-value.js');
@@ -26,6 +27,7 @@ const MappingCondition = ({
   renderTrigger,
   hasDerivedQuestions
 }) => {
+  const { tid } = testId_context.useTestId();
   const [isOpen, setIsOpen] = React.useState(false);
   const [hasFilterGroups, setHasFilterGroups] = React.useState(false);
   const [areFiltersValid, setAreFiltersValid] = React.useState(false);
@@ -95,7 +97,7 @@ const MappingCondition = ({
       }
     ),
     document.body
-  ), /* @__PURE__ */ React.createElement(dialog.DialogTrigger, { asChild: true, onClick: handleOpen }, renderTrigger ? renderTrigger(handleOpen) : /* @__PURE__ */ React.createElement(
+  ), /* @__PURE__ */ React.createElement(dialog.DialogTrigger, { asChild: true, onClick: handleOpen, "data-testid": tid("open-conditions") }, renderTrigger ? renderTrigger(handleOpen) : /* @__PURE__ */ React.createElement(
     text.Text,
     {
       className: "dm-sans",
@@ -137,13 +139,14 @@ const MappingCondition = ({
       className: "dm-sans",
       css: { fontFamily: "DM Sans !important" }
     },
-    /* @__PURE__ */ React.createElement(flex.Flex, { justifyContent: "flex-end", css: { justifyContent: "flex-end" } }, /* @__PURE__ */ React.createElement(dialog.DialogClose, { asChild: true }, /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$4" }, /* @__PURE__ */ React.createElement(button.Button, { size: "lg", color: "default" }, uiStrings.MAPPING_CONDITION_STRINGS.CANCEL), /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React.createElement(flex.Flex, { justifyContent: "flex-end", css: { justifyContent: "flex-end" } }, /* @__PURE__ */ React.createElement(dialog.DialogClose, { asChild: true }, /* @__PURE__ */ React.createElement(flex.Flex, { alignItems: "center", gap: "$4" }, /* @__PURE__ */ React.createElement(button.Button, { size: "lg", color: "default", "data-testid": tid("cancel-conditions") }, uiStrings.MAPPING_CONDITION_STRINGS.CANCEL), /* @__PURE__ */ React.createElement(
       button.Button,
       {
         size: "lg",
         color: "primary",
         onClick: handleSave,
-        disabled: isSaveDisabled
+        disabled: isSaveDisabled,
+        "data-testid": tid("save-conditions")
       },
       uiStrings.MAPPING_CONDITION_STRINGS.SAVE
     ))))

package/dist/cjs/commons/components/mapping-conditions/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../src/commons/components/mapping-conditions/index.tsx"],"sourcesContent":["/* ----- Imports ----- /\n\nimport React, { useState, useRef, useCallback, useMemo } from 'react';\nimport {\n Dialog,\n DialogHeader,\n DialogTitle,\n DialogBody,\n DialogFooter,\n DialogClose,\n DialogTrigger,\n DialogContent,\n IconButton,\n Box,\n Button,\n Flex,\n Text,\n} from '@sparrowengg/twigs-react';\nimport { CloseIcon } from '@sparrowengg/twigs-react-icons';\nimport { createPortal } from 'react-dom';\nimport { ConditionWrapper } from './components';\nimport { MappingConditionProps, ConditionWrapperHandle } from './types';\nimport { MAPPING_CONDITION_STRINGS } from './constants';\nimport { filterDerivedQuestionsFromConditionData } from './helpers';\n\n/ ----- Main Component / Export ----- /\n\n/\n MappingCondition component for managing filter conditions in a dialog\n \n @param {MappingConditionProps} props - Component props\n * @returns {JSX.Element} Rendered mapping condition dialog\n /\nexport const MappingCondition: React.FC<MappingConditionProps> = ({\n existingContions,\n setExistingCondtions,\n conditionData,\n renderTrigger,\n hasDerivedQuestions,\n}) => {\n / ----- States ----- /\n\n const [isOpen, setIsOpen] = useState(false);\n const [hasFilterGroups, setHasFilterGroups] = useState(false);\n const [areFiltersValid, setAreFiltersValid] = useState(false);\n\n / ----- Refs ----- /\n\n const ref = useRef<ConditionWrapperHandle>(null);\n\n / ----- Event Handlers ----- /\n\n /\n Handles changes in filter groups count\n * @param {number} filterGroupsLength - Number of filter groups\n /\n const onConditionsChange = useCallback((filterGroupsLength: number) => {\n setHasFilterGroups(filterGroupsLength > 0);\n }, []);\n\n /\n Handles validation state changes\n * @param {boolean} isValid - Whether filters are valid\n /\n const onValidationChange = useCallback((isValid: boolean) => {\n setAreFiltersValid(isValid);\n }, []);\n\n /\n Handles opening the dialog\n /\n const handleOpen = useCallback(() => {\n setIsOpen(true);\n }, []);\n\n /\n Handles save button click\n /\n const handleSave = useCallback(() => {\n ref.current?.handleSave();\n }, []);\n\n / ----- Memoized Values ----- /\n\n /\n Condition data with the Enrich (derived questions) category stripped out\n * unless the integration opts in via `hasDerivedQuestions`.\n /\n const effectiveConditionData = useMemo(\n () =>\n filterDerivedQuestionsFromConditionData(\n conditionData,\n hasDerivedQuestions\n ),\n [conditionData, hasDerivedQuestions]\n );\n\n const isSaveDisabled = useMemo(\n () => !hasFilterGroups \|\| !areFiltersValid,\n [hasFilterGroups, areFiltersValid]\n );\n\n const dialogContentCss = useMemo(\n () => ({\n fontFamily: 'DM Sans !important',\n minHeight: '332px',\n maxHeight: '532px',\n p: {\n margin: '0 !important',\n },\n zIndex: '9999',\n }),\n []\n );\n\n const dialogBodyCss = useMemo(\n () => ({\n fontFamily: 'DM Sans !important',\n padding: '$12 !important',\n minHeight: '188px',\n maxHeight: '388px',\n overflowY: 'auto' as const,\n p: {\n margin: '0 !important',\n },\n }),\n []\n );\n\n / ----- Render ----- */\n\n return (\n <Dialog size=\"md\" modal={false} open={isOpen} onOpenChange={setIsOpen}>\n {isOpen &&\n createPortal(\n <Box\n className=\"mapping-condition-overlay\"\n css={{\n height: '100vh',\n width: '100vw',\n position: 'fixed',\n inset: '0',\n backgroundColorOpacity: ['$black700', 0.6],\n zIndex: '999',\n }}\n />,\n document.body\n )}\n <DialogTrigger asChild onClick={handleOpen}>\n {renderTrigger ? (\n renderTrigger(handleOpen)\n ) : (\n <Text\n className=\"dm-sans\"\n weight=\"medium\"\n css={{\n color: '$primary500',\n cursor: 'pointer',\n fontFamily: 'DM Sans !important',\n }}\n >\n {MAPPING_CONDITION_STRINGS.TRIGGER_TEXT}\n </Text>\n )}\n </DialogTrigger>\n <DialogContent className=\"dm-sans mapping-condition-content\" css={dialogContentCss}>\n <DialogHeader\n className=\"dm-sans\"\n css={{\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n justifyContent: 'center',\n fontFamily: 'DM Sans !important',\n }}\n >\n <DialogTitle size=\"md\">{MAPPING_CONDITION_STRINGS.DIALOG_TITLE}</DialogTitle>\n </DialogHeader>\n <DialogBody className=\"dm-sans\" css={dialogBodyCss}>\n <ConditionWrapper\n conditionData={effectiveConditionData}\n existingContions={existingContions}\n setExistingCondtions={setExistingCondtions \|\| (() => {})}\n onConditionsChange={onConditionsChange}\n onValidationChange={onValidationChange}\n ref={ref}\n />\n </DialogBody>\n <DialogFooter\n className=\"dm-sans\"\n css={{ fontFamily: 'DM Sans !important' }}\n >\n <Flex justifyContent=\"flex-end\" css={{ justifyContent: 'flex-end' }}>\n <DialogClose asChild>\n <Flex alignItems=\"center\" gap=\"$4\">\n <Button size=\"lg\" color=\"default\">\n {MAPPING_CONDITION_STRINGS.CANCEL}\n </Button>\n <Button\n size=\"lg\"\n color=\"primary\"\n onClick={handleSave}\n disabled={isSaveDisabled}\n >\n {MAPPING_CONDITION_STRINGS.SAVE}\n </Button>\n </Flex>\n </DialogClose>\n </Flex>\n </DialogFooter>\n <Box\n css={{\n position: 'absolute',\n top: '$8',\n right: '$8',\n fontFamily: 'DM Sans !important',\n }}\n >\n <DialogClose className=\"dm-sans\" asChild>\n <IconButton\n size=\"lg\"\n icon={<CloseIcon />}\n variant=\"ghost\"\n aria-label=\"Close\"\n color=\"default\"\n />\n </DialogClose>\n </Box>\n </DialogContent>\n </Dialog>\n );\n};\n\nexport default MappingCondition;\n"],"names":["useState","useRef","useCallback","useMemo","filterDerivedQuestionsFromConditionData","Dialog","createPortal","Box","DialogTrigger","Text","MAPPING_CONDITION_STRINGS","DialogContent","DialogHeader","DialogTitle","DialogBody","ConditionWrapper","DialogFooter","Flex","DialogClose","Button","IconButton","CloseIcon"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../src/commons/components/mapping-conditions/index.tsx"],"sourcesContent":["/* ----- Imports ----- /\n\nimport React, { useState, useRef, useCallback, useMemo } from 'react';\nimport {\n Dialog,\n DialogHeader,\n DialogTitle,\n DialogBody,\n DialogFooter,\n DialogClose,\n DialogTrigger,\n DialogContent,\n IconButton,\n Box,\n Button,\n Flex,\n Text,\n} from '@sparrowengg/twigs-react';\nimport { CloseIcon } from '@sparrowengg/twigs-react-icons';\nimport { createPortal } from 'react-dom';\nimport { useTestId } from '../../context/test-id.context';\nimport { ConditionWrapper } from './components';\nimport { MappingConditionProps, ConditionWrapperHandle } from './types';\nimport { MAPPING_CONDITION_STRINGS } from './constants';\nimport { filterDerivedQuestionsFromConditionData } from './helpers';\n\n/ ----- Main Component / Export ----- /\n\n/\n MappingCondition component for managing filter conditions in a dialog\n \n @param {MappingConditionProps} props - Component props\n * @returns {JSX.Element} Rendered mapping condition dialog\n /\nexport const MappingCondition: React.FC<MappingConditionProps> = ({\n existingContions,\n setExistingCondtions,\n conditionData,\n renderTrigger,\n hasDerivedQuestions,\n}) => {\n / ----- States ----- /\n\n const { tid } = useTestId();\n const [isOpen, setIsOpen] = useState(false);\n const [hasFilterGroups, setHasFilterGroups] = useState(false);\n const [areFiltersValid, setAreFiltersValid] = useState(false);\n\n / ----- Refs ----- /\n\n const ref = useRef<ConditionWrapperHandle>(null);\n\n / ----- Event Handlers ----- /\n\n /\n Handles changes in filter groups count\n * @param {number} filterGroupsLength - Number of filter groups\n /\n const onConditionsChange = useCallback((filterGroupsLength: number) => {\n setHasFilterGroups(filterGroupsLength > 0);\n }, []);\n\n /\n Handles validation state changes\n * @param {boolean} isValid - Whether filters are valid\n /\n const onValidationChange = useCallback((isValid: boolean) => {\n setAreFiltersValid(isValid);\n }, []);\n\n /\n Handles opening the dialog\n /\n const handleOpen = useCallback(() => {\n setIsOpen(true);\n }, []);\n\n /\n Handles save button click\n /\n const handleSave = useCallback(() => {\n ref.current?.handleSave();\n }, []);\n\n / ----- Memoized Values ----- /\n\n /\n Condition data with the Enrich (derived questions) category stripped out\n * unless the integration opts in via `hasDerivedQuestions`.\n /\n const effectiveConditionData = useMemo(\n () =>\n filterDerivedQuestionsFromConditionData(\n conditionData,\n hasDerivedQuestions\n ),\n [conditionData, hasDerivedQuestions]\n );\n\n const isSaveDisabled = useMemo(\n () => !hasFilterGroups \|\| !areFiltersValid,\n [hasFilterGroups, areFiltersValid]\n );\n\n const dialogContentCss = useMemo(\n () => ({\n fontFamily: 'DM Sans !important',\n minHeight: '332px',\n maxHeight: '532px',\n p: {\n margin: '0 !important',\n },\n zIndex: '9999',\n }),\n []\n );\n\n const dialogBodyCss = useMemo(\n () => ({\n fontFamily: 'DM Sans !important',\n padding: '$12 !important',\n minHeight: '188px',\n maxHeight: '388px',\n overflowY: 'auto' as const,\n p: {\n margin: '0 !important',\n },\n }),\n []\n );\n\n / ----- Render ----- */\n\n return (\n <Dialog size=\"md\" modal={false} open={isOpen} onOpenChange={setIsOpen}>\n {isOpen &&\n createPortal(\n <Box\n className=\"mapping-condition-overlay\"\n css={{\n height: '100vh',\n width: '100vw',\n position: 'fixed',\n inset: '0',\n backgroundColorOpacity: ['$black700', 0.6],\n zIndex: '999',\n }}\n />,\n document.body\n )}\n <DialogTrigger asChild onClick={handleOpen} data-testid={tid('open-conditions')}>\n {renderTrigger ? (\n renderTrigger(handleOpen)\n ) : (\n <Text\n className=\"dm-sans\"\n weight=\"medium\"\n css={{\n color: '$primary500',\n cursor: 'pointer',\n fontFamily: 'DM Sans !important',\n }}\n >\n {MAPPING_CONDITION_STRINGS.TRIGGER_TEXT}\n </Text>\n )}\n </DialogTrigger>\n <DialogContent className=\"dm-sans mapping-condition-content\" css={dialogContentCss}>\n <DialogHeader\n className=\"dm-sans\"\n css={{\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n justifyContent: 'center',\n fontFamily: 'DM Sans !important',\n }}\n >\n <DialogTitle size=\"md\">{MAPPING_CONDITION_STRINGS.DIALOG_TITLE}</DialogTitle>\n </DialogHeader>\n <DialogBody className=\"dm-sans\" css={dialogBodyCss}>\n <ConditionWrapper\n conditionData={effectiveConditionData}\n existingContions={existingContions}\n setExistingCondtions={setExistingCondtions \|\| (() => {})}\n onConditionsChange={onConditionsChange}\n onValidationChange={onValidationChange}\n ref={ref}\n />\n </DialogBody>\n <DialogFooter\n className=\"dm-sans\"\n css={{ fontFamily: 'DM Sans !important' }}\n >\n <Flex justifyContent=\"flex-end\" css={{ justifyContent: 'flex-end' }}>\n <DialogClose asChild>\n <Flex alignItems=\"center\" gap=\"$4\">\n <Button size=\"lg\" color=\"default\" data-testid={tid('cancel-conditions')}>\n {MAPPING_CONDITION_STRINGS.CANCEL}\n </Button>\n <Button\n size=\"lg\"\n color=\"primary\"\n onClick={handleSave}\n disabled={isSaveDisabled}\n data-testid={tid('save-conditions')}\n >\n {MAPPING_CONDITION_STRINGS.SAVE}\n </Button>\n </Flex>\n </DialogClose>\n </Flex>\n </DialogFooter>\n <Box\n css={{\n position: 'absolute',\n top: '$8',\n right: '$8',\n fontFamily: 'DM Sans !important',\n }}\n >\n <DialogClose className=\"dm-sans\" asChild>\n <IconButton\n size=\"lg\"\n icon={<CloseIcon />}\n variant=\"ghost\"\n aria-label=\"Close\"\n color=\"default\"\n />\n </DialogClose>\n </Box>\n </DialogContent>\n </Dialog>\n );\n};\n\nexport default MappingCondition;\n"],"names":["useTestId","useState","useRef","useCallback","useMemo","filterDerivedQuestionsFromConditionData","Dialog","createPortal","Box","DialogTrigger","Text","MAPPING_CONDITION_STRINGS","DialogContent","DialogHeader","DialogTitle","DialogBody","ConditionWrapper","DialogFooter","Flex","DialogClose","Button","IconButton","CloseIcon"],"mappings":"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"}

package/dist/cjs/contact-import/components/ContactImportHeader.js CHANGED Viewed

@@ -2,6 +2,7 @@
 var React = require('react');
 var arrow = require('../../commons/icons/arrow.js');
+var testId_context = require('../../commons/context/test-id.context.js');
 var uiStrings = require('../constants/ui-strings.js');
 var ContactImportModal = require('./ContactImportModal.js');
 var flex = require('../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
@@ -24,6 +25,7 @@ const ContactImportHeader = ({
   navigateMappingPage,
   invitePortal
 }) => {
+  const { tid } = testId_context.useTestId();
   const [showImportModal, setShowImportModal] = React.useState(false);
   const handleBackClick = () => {
     setNewImport(false);
@@ -74,7 +76,8 @@ const ContactImportHeader = ({
           color: "default",
           icon: /* @__PURE__ */ React.createElement(arrowLeft.ArrowLeftIcon, null),
           size: "lg",
-          "aria-label": "Go back"
+          "aria-label": "Go back",
+          "data-testid": tid("back-btn")
         }
       ),
       /* @__PURE__ */ React.createElement(heading.Heading, { size: "h6" }, uiStrings.CONTACT_IMPORT_UI_STRINGS.NEW_CONTACT_IMPORT)
@@ -96,7 +99,8 @@ const ContactImportHeader = ({
           color: "default",
           variant: "ghost",
           size: "md",
-          onClick: handleEventSetupClick
+          onClick: handleEventSetupClick,
+          "data-testid": tid("configure-tab")
         },
         uiStrings.CONTACT_IMPORT_UI_STRINGS.EVENT_SETUP
       ),
@@ -118,7 +122,8 @@ const ContactImportHeader = ({
       {
         size: "lg",
         onClick: handleContinueMapping,
-        css: { visibility: isContactMappingPage ? "visible" : "hidden" }
+        css: { visibility: isContactMappingPage ? "visible" : "hidden" },
+        "data-testid": tid("continue-btn")
       },
       uiStrings.CONTACT_IMPORT_UI_STRINGS.CONTINUE_MAPPING
     ),

package/dist/cjs/contact-import/components/ContactImportHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactImportHeader.js","sources":["../../../../src/contact-import/components/ContactImportHeader.tsx"],"sourcesContent":["import {\n Button,\n Flex,\n Heading,\n IconButton,\n toast\n} from \"@sparrowengg/twigs-react\";\nimport { ArrowLeftIcon } from \"@sparrowengg/twigs-react-icons\";\nimport React, { useState } from \"react\";\nimport Arrow from \"../../commons/icons/arrow\";\nimport { ContactImportHeaderProps } from \"../types\";\nimport { CONTACT_IMPORT_UI_STRINGS } from \"../constants/ui-strings\";\nimport { ContactImportModal } from \"./ContactImportModal\";\n\nexport const ContactImportHeader: React.FC<ContactImportHeaderProps> = ({\n importName,\n setImportName,\n setNewImport,\n setContactImportField,\n contactImportField,\n hasPreviousMapping,\n previousMappingHandler,\n onSaveHandler,\n isContactMappingPage,\n navigateMappingPage,\n invitePortal,\n}) => {\n const [showImportModal, setShowImportModal] = useState(false);\n\n const handleBackClick = () => {\n setNewImport(false);\n previousMappingHandler();\n };\n\n const handleEventSetupClick = () => {\n if (isContactMappingPage) {\n navigateMappingPage(false);\n }\n };\n\n const handleContinueMapping = () => {\n if(!contactImportField?.fields?.some(\n (field) =>\n field?.surveySparrowField === 'email' \|\| field?.surveySparrowField === 'mobile'\n )){\n toast({\n variant: 'error',\n title: 'Please map Email or mobile or uniqueId field'\n });\n return\n }\n setShowImportModal(true);\n };\n\n const handleSaveAndClose = async (importName: string) => {\n await onSaveHandler(importName);\n };\n\n return (\n <Flex\n alignItems=\"center\"\n justifyContent=\"space-between\"\n css={{\n borderBottom: \"$borderWidths$xs solid $neutral200\",\n padding: \"$8 $12\",\n }}\n >\n <Flex\n gap=\"$6\"\n alignItems=\"center\"\n css={{ visibility: hasPreviousMapping ? \"visible\" : \"hidden\" }}\n >\n <IconButton\n onClick={handleBackClick}\n color=\"default\"\n icon={<ArrowLeftIcon />}\n size=\"lg\"\n aria-label=\"Go back\"\n />\n <Heading size=\"h6\">{CONTACT_IMPORT_UI_STRINGS.NEW_CONTACT_IMPORT}</Heading>\n </Flex>\n <Flex\n alignItems=\"center\"\n gap=\"$4\"\n css={{ \n width: \"420px !important\",\n \"& button\": { background: \"transparent !important\", fontSize: \"$md\" },\n }}\n >\n <Button\n css={{ color: !isContactMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n color=\"default\"\n variant=\"ghost\"\n size=\"md\"\n onClick={handleEventSetupClick}\n >\n {CONTACT_IMPORT_UI_STRINGS.EVENT_SETUP}\n </Button>\n <Arrow />\n <Button\n css={{ color: isContactMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n color=\"default\"\n variant=\"ghost\"\n size=\"md\"\n disabled={!isContactMappingPage}\n >\n {CONTACT_IMPORT_UI_STRINGS.MAPPING}\n </Button>\n </Flex>\n <Button\n size=\"lg\"\n onClick={handleContinueMapping}\n css={{ visibility: isContactMappingPage ? \"visible\" : \"hidden\"}}\n >\n {CONTACT_IMPORT_UI_STRINGS.CONTINUE_MAPPING}\n </Button>\n {showImportModal && (\n <ContactImportModal\n importName={importName}\n setImportName={setImportName}\n setContactImportField={setContactImportField}\n contactImportField={contactImportField}\n invitePortal={invitePortal}\n onSaveHandler={handleSaveAndClose}\n onCloseHandler={() => setShowImportModal(false)}\n />\n )}\n </Flex>\n );\n};\n\n"],"names":["useState","toast","importName","Flex","IconButton","ArrowLeftIcon","Heading","CONTACT_IMPORT_UI_STRINGS","Button","Arrow","ContactImportModal"],"mappings":"~~;;;;;;;;;;;;;AAcO~~,MAAM,sBAA0D,CAAC;AAAA,EACtE,UAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AAAA,EACA,qBAAA;AAAA,EACA,kBAAA;AAAA,EACA,kBAAA;AAAA,EACA,sBAAA;AAAA,EACA,aAAA;AAAA,EACA,oBAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,~~GAAIA~~,eAAS,KAAK,CAAA;AAE5D,EAAA,MAAM,kBAAkB,MAAM;AAC5B,IAAA,YAAA,CAAa,KAAK,CAAA;AAClB,IAAA,sBAAA,EAAuB;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,wBAAwB,MAAM;AAClC,IAAA,IAAI,oBAAA,EAAsB;AACxB,MAAA,mBAAA,CAAoB,KAAK,CAAA;AAAA,IAC3B;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,wBAAwB,MAAM;~~AAxCtC~~,IAAA,IAAA,EAAA;~~AAyCI~~,IAAA,IAAG,EAAA,CAAC,EAAA,GAAA,kBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,kBAAA,CAAoB,MAAA,KAApB,IAAA,GAAA,MAAA,GAAA,EAAA,CAA4B,IAAA;AAAA,MAC9B,CAAC,KAAA,KAAA,CACC,KAAA,IAAA,IAAA,GAAA,MAAA,GAAA,KAAA,CAAO,kBAAA,MAAuB,OAAA,IAAA,CAAW,+BAAO,kBAAA,MAAuB;AAAA,KAAA,CAAA,EACzE;AACA,MAAAC,cAAA,CAAM;AAAA,QACJ,OAAA,EAAS,OAAA;AAAA,QACT,KAAA,EAAO;AAAA,OACR,CAAA;AACD,MAAA;AAAA,IACF;AACA,IAAA,kBAAA,CAAmB,IAAI,CAAA;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,kBAAA,GAAqB,OAAOC,WAAAA,KAAuB;AACvD,IAAA,MAAM,cAAcA,WAAU,CAAA;AAAA,EAChC,CAAA;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,UAAA,EAAW,QAAA;AAAA,MACX,cAAA,EAAe,eAAA;AAAA,MACf,GAAA,EAAK;AAAA,QACH,YAAA,EAAc,oCAAA;AAAA,QACd,OAAA,EAAS;AAAA;AACX,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACA,SAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAI,IAAA;AAAA,QACJ,UAAA,EAAW,QAAA;AAAA,QACX,GAAA,EAAK,EAAE,UAAA,EAAY,kBAAA,GAAqB,YAAY,QAAA;AAAS,OAAA;AAAA,sBAE7D,KAAA,CAAA,aAAA;AAAA,QAACC,qBAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAS,eAAA;AAAA,UACT,KAAA,EAAM,SAAA;AAAA,UACN,IAAA,sCAAOC,uBAAA,EAAA,IAAc,CAAA;AAAA,UACrB,IAAA,EAAK,IAAA;AAAA,UACL,YAAA,EAAW;AAAA;AAAA,~~OACb~~;AAAA,sBACA,KAAA,CAAA,aAAA,CAACC,eAAA,EAAA,EAAQ,IAAA,EAAK,IAAA,EAAA,EAAMC,oCAA0B,kBAAmB;AAAA,KACnE;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAACJ,SAAA;AAAA,MAAA;AAAA,QACC,UAAA,EAAW,QAAA;AAAA,QACX,GAAA,EAAI,IAAA;AAAA,QACJ,GAAA,EAAK;AAAA,UACH,KAAA,EAAO,kBAAA;AAAA,UACP,UAAA,EAAY,EAAE,UAAA,EAAY,wBAAA,EAA0B,UAAU,KAAA;AAAM;AACtE,OAAA;AAAA,sBAEA,KAAA,CAAA,aAAA;AAAA,QAACK,aAAA;AAAA,QAAA;AAAA,UACC,KAAK,EAAE,KAAA,EAAO,CAAC,oBAAA,GAAuB,gBAAgB,aAAA,EAAc;AAAA,UACpE,KAAA,EAAM,SAAA;AAAA,UACN,OAAA,EAAQ,OAAA;AAAA,UACR,IAAA,EAAK,IAAA;AAAA,UACL,OAAA,EAAS;AAAA,SAAA;AAAA,~~QAERD~~,mCAAA,CAA0B;AAAA,OAC7B;AAAA,0CACCE,aAAA,EAAA,IAAM,CAAA;AAAA,sBACP,KAAA,CAAA,aAAA;AAAA,QAACD,aAAA;AAAA,QAAA;AAAA,UACC,GAAA,EAAK,EAAE,KAAA,EAAO,oBAAA,GAAuB,gBAAgB,aAAA,EAAc;AAAA,UACnE,KAAA,EAAM,SAAA;AAAA,UACN,OAAA,EAAQ,OAAA;AAAA,UACR,IAAA,EAAK,IAAA;AAAA,UACL,UAAU,CAAC;AAAA,SAAA;AAAA,QAEVD,mCAAA,CAA0B;AAAA;AAC7B,KACF;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,qBAAA;AAAA,QACT,GAAA,EAAK,EAAE,UAAA,EAAY,oBAAA,GAAuB,YAAY,QAAA;~~AAAQ~~,OAAA;AAAA,~~MAE7DD~~,mCAAA,CAA0B;AAAA,KAC7B;AAAA,IACC,eAAA,oBACC,KAAA,CAAA,aAAA;AAAA,MAACG,qCAAA;AAAA,MAAA;AAAA,QACC,UAAA;AAAA,QACA,aAAA;AAAA,QACA,qBAAA;AAAA,QACA,kBAAA;AAAA,QACA,YAAA;AAAA,QACA,aAAA,EAAe,kBAAA;AAAA,QACf,cAAA,EAAgB,MAAM,kBAAA,CAAmB,KAAK;AAAA;AAAA;AAChD,GAEJ;AAEJ;;;;"}
1	+ {"version":3,"file":"ContactImportHeader.js","sources":["../../../../src/contact-import/components/ContactImportHeader.tsx"],"sourcesContent":["import {\n Button,\n Flex,\n Heading,\n IconButton,\n toast\n} from \"@sparrowengg/twigs-react\";\nimport { ArrowLeftIcon } from \"@sparrowengg/twigs-react-icons\";\nimport React, { useState } from \"react\";\nimport Arrow from \"../../commons/icons/arrow\";\nimport { useTestId } from \"../../commons/context/test-id.context\";\nimport { ContactImportHeaderProps } from \"../types\";\nimport { CONTACT_IMPORT_UI_STRINGS } from \"../constants/ui-strings\";\nimport { ContactImportModal } from \"./ContactImportModal\";\n\nexport const ContactImportHeader: React.FC<ContactImportHeaderProps> = ({\n importName,\n setImportName,\n setNewImport,\n setContactImportField,\n contactImportField,\n hasPreviousMapping,\n previousMappingHandler,\n onSaveHandler,\n isContactMappingPage,\n navigateMappingPage,\n invitePortal,\n}) => {\n const { tid } = useTestId();\n const [showImportModal, setShowImportModal] = useState(false);\n\n const handleBackClick = () => {\n setNewImport(false);\n previousMappingHandler();\n };\n\n const handleEventSetupClick = () => {\n if (isContactMappingPage) {\n navigateMappingPage(false);\n }\n };\n\n const handleContinueMapping = () => {\n if(!contactImportField?.fields?.some(\n (field) =>\n field?.surveySparrowField === 'email' \|\| field?.surveySparrowField === 'mobile'\n )){\n toast({\n variant: 'error',\n title: 'Please map Email or mobile or uniqueId field'\n });\n return\n }\n setShowImportModal(true);\n };\n\n const handleSaveAndClose = async (importName: string) => {\n await onSaveHandler(importName);\n };\n\n return (\n <Flex\n alignItems=\"center\"\n justifyContent=\"space-between\"\n css={{\n borderBottom: \"$borderWidths$xs solid $neutral200\",\n padding: \"$8 $12\",\n }}\n >\n <Flex\n gap=\"$6\"\n alignItems=\"center\"\n css={{ visibility: hasPreviousMapping ? \"visible\" : \"hidden\" }}\n >\n <IconButton\n onClick={handleBackClick}\n color=\"default\"\n icon={<ArrowLeftIcon />}\n size=\"lg\"\n aria-label=\"Go back\"\n data-testid={tid('back-btn')}\n />\n <Heading size=\"h6\">{CONTACT_IMPORT_UI_STRINGS.NEW_CONTACT_IMPORT}</Heading>\n </Flex>\n <Flex\n alignItems=\"center\"\n gap=\"$4\"\n css={{ \n width: \"420px !important\",\n \"& button\": { background: \"transparent !important\", fontSize: \"$md\" },\n }}\n >\n <Button\n css={{ color: !isContactMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n color=\"default\"\n variant=\"ghost\"\n size=\"md\"\n onClick={handleEventSetupClick}\n data-testid={tid('configure-tab')}\n >\n {CONTACT_IMPORT_UI_STRINGS.EVENT_SETUP}\n </Button>\n <Arrow />\n <Button\n css={{ color: isContactMappingPage ? \"$neutral900\" : \"$neutral800\" }}\n color=\"default\"\n variant=\"ghost\"\n size=\"md\"\n disabled={!isContactMappingPage}\n >\n {CONTACT_IMPORT_UI_STRINGS.MAPPING}\n </Button>\n </Flex>\n <Button\n size=\"lg\"\n onClick={handleContinueMapping}\n css={{ visibility: isContactMappingPage ? \"visible\" : \"hidden\"}}\n data-testid={tid('continue-btn')}\n >\n {CONTACT_IMPORT_UI_STRINGS.CONTINUE_MAPPING}\n </Button>\n {showImportModal && (\n <ContactImportModal\n importName={importName}\n setImportName={setImportName}\n setContactImportField={setContactImportField}\n contactImportField={contactImportField}\n invitePortal={invitePortal}\n onSaveHandler={handleSaveAndClose}\n onCloseHandler={() => setShowImportModal(false)}\n />\n )}\n </Flex>\n );\n};\n\n"],"names":["useTestId","useState","toast","importName","Flex","IconButton","ArrowLeftIcon","Heading","CONTACT_IMPORT_UI_STRINGS","Button","Arrow","ContactImportModal"],"mappings":"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"}

package/dist/cjs/contact-import/components/ContactImportModal.js CHANGED Viewed

@@ -1,6 +1,7 @@
 'use strict';
 var React = require('react');
+var testId_context = require('../../commons/context/test-id.context.js');
 var uiStrings = require('../constants/ui-strings.js');
 var index = require('../../commons/constants/index.js');
 var index$1 = require('../../commons/helpers/index.js');
@@ -43,6 +44,7 @@ const ContactImportModal = ({
   invitePortal
 }) => {
   var _a;
+  const { tid } = testId_context.useTestId();
   const [internalLoading, setInternalLoading] = React.useState(false);
   const handleInputChange = (event) => {
     setImportName(event.currentTarget.value);
@@ -97,7 +99,8 @@ const ContactImportModal = ({
             }
           },
           onClick: onCloseHandler,
-          "aria-label": "Close modal"
+          "aria-label": "Close modal",
+          "data-testid": tid("close-modal")
         }
       )
     ),
@@ -134,14 +137,15 @@ const ContactImportModal = ({
           padding: "$8 $12"
         }
       },
-      /* @__PURE__ */ React.createElement(button.Button, { size: "lg", color: "default", disabled: internalLoading, onClick: onCloseHandler }, uiStrings.CONTACT_IMPORT_UI_STRINGS.CANCEL),
+      /* @__PURE__ */ React.createElement(button.Button, { size: "lg", color: "default", disabled: internalLoading, onClick: onCloseHandler, "data-testid": tid("cancel-btn") }, uiStrings.CONTACT_IMPORT_UI_STRINGS.CANCEL),
       /* @__PURE__ */ React.createElement(
         button.Button,
         {
           size: "lg",
           disabled: isFinishDisabled || internalLoading,
           onClick: async () => await handleFinishImport(),
-          loading: internalLoading
+          loading: internalLoading,
+          "data-testid": tid("finish-import")
         },
         uiStrings.CONTACT_IMPORT_UI_STRINGS.FINISH_IMPORT
       )

package/dist/cjs/contact-import/components/ContactImportModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactImportModal.js","sources":["../../../../src/contact-import/components/ContactImportModal.tsx"],"sourcesContent":["import {\n Box,\n Button,\n Checkbox,\n Dialog,\n DialogContent,\n Flex,\n FormInput,\n Heading,\n IconButton,\n} from \"@sparrowengg/twigs-react\";\nimport { CloseIcon } from \"@sparrowengg/twigs-react-icons\";\nimport React, { useState } from \"react\";\nimport { ContactImportFieldType } from \"../types\";\nimport { CONTACT_IMPORT_UI_STRINGS } from \"../constants/ui-strings\";\nimport { MODAL_MAX_WIDTH, INPUT_MAX_LENGTH } from \"../../commons/constants\";\nimport { generateUniqueId } from \"../../commons/helpers\";\nimport { isValidInputLength } from \"../utils\";\n\ninterface ContactImportModalProps {\n importName: string;\n setImportName: React.Dispatch<React.SetStateAction<string>>;\n setContactImportField: React.Dispatch<React.SetStateAction<ContactImportFieldType>>;\n contactImportField: ContactImportFieldType;\n onCloseHandler: () => void;\n onSaveHandler: (importName: string) => void \| Promise<void>;\n invitePortal: {\n hasInvitePortal: boolean;\n value: boolean \| null;\n onChangeHandler: (value: boolean) => void;\n };\n}\n\nexport const ContactImportModal: React.FC<ContactImportModalProps> = ({\n importName,\n setImportName,\n setContactImportField,\n contactImportField,\n onCloseHandler,\n onSaveHandler,\n invitePortal,\n}) => {\n const [internalLoading, setInternalLoading] = useState(false);\n\n const handleInputChange = (event: any) => {\n setImportName(event.currentTarget.value);\n };\n\n const handleInvitePortalChange = (value: any) => {\n setContactImportField({\n ...contactImportField,\n invitePortal: value,\n });\n invitePortal.onChangeHandler(value);\n };\n\n const handleFinishImport = async () => {\n setInternalLoading(true);\n setContactImportField({\n ...contactImportField,\n description: importName,\n id: generateUniqueId(),\n });\n await onSaveHandler(importName);\n setInternalLoading(false);\n };\n const isFinishDisabled = !isValidInputLength(importName);\n\n\n return (\n <Dialog open>\n <DialogContent\n className=\"dm-sans\"\n css={{\n fontFamily: \"DM Sans !important\",\n 'p': {\n margin: \"0 !important\",\n },\n padding: 0,\n borderRadius: \"$3xl\",\n maxWidth: MODAL_MAX_WIDTH,\n }}\n >\n <Flex\n alignItems=\"center\"\n justifyContent=\"space-between\"\n className=\"dm-sans\"\n css={{\n padding: \"$8 $12\",\n borderBottom: \"$borderWidths$xs solid $neutral200\",\n }}\n >\n <Heading className=\"dm-sans\" size=\"h6\" css={{ color: \"$neutral900\" }}>\n {CONTACT_IMPORT_UI_STRINGS.IMPORT_CONFIGURATION}\n </Heading>\n <IconButton\n variant=\"ghost\"\n color=\"default\"\n disabled={internalLoading}\n icon={<CloseIcon />}\n size=\"lg\"\n css={{\n \"& svg\": {\n color: \"#64748B !important\",\n },\n }}\n onClick={onCloseHandler}\n aria-label=\"Close modal\"\n />\n </Flex>\n <Box\n className=\"dm-sans\"\n css={{\n padding: \"$12\",\n }}\n >\n <FormInput\n className=\"dm-sans\"\n label={CONTACT_IMPORT_UI_STRINGS.TITLE_LABEL}\n requiredIndicator\n value={contactImportField?.configure?.reference \|\| importName}\n maxLength={INPUT_MAX_LENGTH}\n max={INPUT_MAX_LENGTH}\n showCount\n onChange={handleInputChange}\n size=\"lg\"\n />\n {/* {invitePortal.hasInvitePortal && (\n <Box css={{ marginTop: \"$12\" }}>\n <Checkbox\n checked={!!invitePortal.value}\n onChange={handleInvitePortalChange}\n >\n {CONTACT_IMPORT_UI_STRINGS.INVITE_TO_PORTAL}\n </Checkbox>\n </Box>\n )} */}\n </Box>\n <Flex\n className=\"dm-sans\"\n gap=\"$4\"\n css={{\n justifyContent: \"flex-end\",\n padding: \"$8 $12\",\n }}\n >\n <Button size=\"lg\" color=\"default\" disabled={internalLoading} onClick={onCloseHandler}>\n {CONTACT_IMPORT_UI_STRINGS.CANCEL}\n </Button>\n <Button\n size=\"lg\"\n disabled={isFinishDisabled \|\| internalLoading}\n onClick={async () => await handleFinishImport()}\n loading={internalLoading}\n >\n {CONTACT_IMPORT_UI_STRINGS.FINISH_IMPORT}\n </Button>\n </Flex>\n </DialogContent>\n </Dialog>\n );\n};\n\n"],"names":["useState","generateUniqueId","isValidInputLength","Dialog","DialogContent","MODAL_MAX_WIDTH","Flex","Heading","CONTACT_IMPORT_UI_STRINGS","IconButton","CloseIcon","Box","FormInput","INPUT_MAX_LENGTH","Button"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO~~,MAAM,qBAAwD,CAAC;AAAA,EACpE,UAAA;AAAA,EACA,aAAA;AAAA,EACA,qBAAA;AAAA,EACA,kBAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF,CAAA,KAAM;~~AAzCN~~,EAAA,IAAA,EAAA;~~AA0CE~~,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,~~GAAIA~~,eAAS,KAAK,CAAA;AAE5D,EAAA,MAAM,iBAAA,GAAoB,CAAC,KAAA,KAAe;AACxC,IAAA,aAAA,CAAc,KAAA,CAAM,cAAc,KAAK,CAAA;AAAA,EACzC,CAAA;AAUA,EAAA,MAAM,qBAAqB,YAAY;AACrC,IAAA,kBAAA,CAAmB,IAAI,CAAA;AACvB,IAAA,qBAAA,CAAsB,iCACjB,kBAAA,CAAA,EADiB;AAAA,MAEpB,WAAA,EAAa,UAAA;AAAA,MACb,IAAIC,wBAAA;AAAiB,KACvB,CAAC,CAAA;AACD,IAAA,MAAM,cAAc,UAAU,CAAA;AAC9B,IAAA,kBAAA,CAAmB,KAAK,CAAA;AAAA,EAC1B,CAAA;AACA,EAAA,MAAM,gBAAA,GAAmB,CAACC,mCAAA,CAAmB,UAAU,CAAA;AAGvD,EAAA,uBACE,KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAO,IAAA,EAAI,IAAA,EAAA,kBACV,KAAA,CAAA,aAAA;AAAA,IAACC,oBAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,SAAA;AAAA,MACV,GAAA,EAAK;AAAA,QACH,UAAA,EAAY,oBAAA;AAAA,QACZ,GAAA,EAAK;AAAA,UACH,MAAA,EAAQ;AAAA,SACV;AAAA,QACA,OAAA,EAAS,CAAA;AAAA,QACT,YAAA,EAAc,MAAA;AAAA,QACd,QAAA,EAAUC;AAAA;AACZ,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAACC,SAAA;AAAA,MAAA;AAAA,QACC,UAAA,EAAW,QAAA;AAAA,QACX,cAAA,EAAe,eAAA;AAAA,QACf,SAAA,EAAU,SAAA;AAAA,QACV,GAAA,EAAK;AAAA,UACH,OAAA,EAAS,QAAA;AAAA,UACT,YAAA,EAAc;AAAA;AAChB,OAAA;AAAA,sBAEA,KAAA,CAAA,aAAA,CAACC,eAAA,EAAA,EAAQ,SAAA,EAAU,SAAA,EAAU,IAAA,EAAK,IAAA,EAAK,GAAA,EAAK,EAAE,KAAA,EAAO,aAAA,EAAc,EAAA,EAChEC,mCAAA,CAA0B,oBAC7B,CAAA;AAAA,sBACA,KAAA,CAAA,aAAA;AAAA,QAACC,qBAAA;AAAA,QAAA;AAAA,UACC,OAAA,EAAQ,OAAA;AAAA,UACR,KAAA,EAAM,SAAA;AAAA,UACN,QAAA,EAAU,eAAA;AAAA,UACV,IAAA,sCAAOC,eAAA,EAAA,IAAU,CAAA;AAAA,UACjB,IAAA,EAAK,IAAA;AAAA,UACL,GAAA,EAAK;AAAA,YACH,OAAA,EAAS;AAAA,cACP,KAAA,EAAO;AAAA;AACT,WACF;AAAA,UACA,OAAA,EAAS,cAAA;AAAA,UACT,YAAA,EAAW;AAAA;AAAA;~~AACb~~,KACF;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAACC,OAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAU,SAAA;AAAA,QACV,GAAA,EAAK;AAAA,UACH,OAAA,EAAS;AAAA;AACX,OAAA;AAAA,sBAEA,KAAA,CAAA,aAAA;AAAA,QAACC,mBAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAU,SAAA;AAAA,UACV,OAAOJ,mCAAA,CAA0B,WAAA;AAAA,UACjC,iBAAA,EAAiB,IAAA;AAAA,UACjB,KAAA,EAAA,CAAA,CAAO,EAAA,GAAA,kBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,kBAAA,CAAoB,SAAA,KAApB,IAAA,GAAA,MAAA,GAAA,EAAA,CAA+B,SAAA,KAAa,UAAA;AAAA,UACnD,SAAA,EAAWK,sBAAA;AAAA,UACX,GAAA,EAAKA,sBAAA;AAAA,UACL,SAAA,EAAS,IAAA;AAAA,UACT,QAAA,EAAU,iBAAA;AAAA,UACV,IAAA,EAAK;AAAA;AAAA;AACP,KAWF;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAACP,SAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAU,SAAA;AAAA,QACV,GAAA,EAAI,IAAA;AAAA,QACJ,GAAA,EAAK;AAAA,UACH,cAAA,EAAgB,UAAA;AAAA,UAChB,OAAA,EAAS;AAAA;AACX,OAAA;AAAA,sBAEA,KAAA,CAAA,aAAA,CAACQ,aAAA,EAAA,EAAO,IAAA,EAAK,IAAA,EAAK,~~KAAA~~,~~EAAM,~~SAAA,EAAU,QAAA,EAAU,eAAA,EAAiB,OAAA,EAAS,~~cAAA~~,EAAA,~~EACnEN~~,~~mCAAA~~,~~CAA0B,~~MAC7B,CAAA;AAAA,sBACA,KAAA,CAAA,aAAA;AAAA,QAACM,aAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,IAAA;AAAA,UACL,UAAU,gBAAA,IAAoB,eAAA;AAAA,UAC9B,OAAA,EAAS,YAAY,MAAM,kBAAA,EAAmB;AAAA,UAC9C,OAAA,EAAS;AAAA,SAAA;AAAA,~~QAERN~~,mCAAA,CAA0B;AAAA;AAC7B;AACF,GAEJ,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"ContactImportModal.js","sources":["../../../../src/contact-import/components/ContactImportModal.tsx"],"sourcesContent":["import {\n Box,\n Button,\n Checkbox,\n Dialog,\n DialogContent,\n Flex,\n FormInput,\n Heading,\n IconButton,\n} from \"@sparrowengg/twigs-react\";\nimport { CloseIcon } from \"@sparrowengg/twigs-react-icons\";\nimport React, { useState } from \"react\";\nimport { useTestId } from \"../../commons/context/test-id.context\";\nimport { ContactImportFieldType } from \"../types\";\nimport { CONTACT_IMPORT_UI_STRINGS } from \"../constants/ui-strings\";\nimport { MODAL_MAX_WIDTH, INPUT_MAX_LENGTH } from \"../../commons/constants\";\nimport { generateUniqueId } from \"../../commons/helpers\";\nimport { isValidInputLength } from \"../utils\";\n\ninterface ContactImportModalProps {\n importName: string;\n setImportName: React.Dispatch<React.SetStateAction<string>>;\n setContactImportField: React.Dispatch<React.SetStateAction<ContactImportFieldType>>;\n contactImportField: ContactImportFieldType;\n onCloseHandler: () => void;\n onSaveHandler: (importName: string) => void \| Promise<void>;\n invitePortal: {\n hasInvitePortal: boolean;\n value: boolean \| null;\n onChangeHandler: (value: boolean) => void;\n };\n}\n\nexport const ContactImportModal: React.FC<ContactImportModalProps> = ({\n importName,\n setImportName,\n setContactImportField,\n contactImportField,\n onCloseHandler,\n onSaveHandler,\n invitePortal,\n}) => {\n const { tid } = useTestId();\n const [internalLoading, setInternalLoading] = useState(false);\n\n const handleInputChange = (event: any) => {\n setImportName(event.currentTarget.value);\n };\n\n const handleInvitePortalChange = (value: any) => {\n setContactImportField({\n ...contactImportField,\n invitePortal: value,\n });\n invitePortal.onChangeHandler(value);\n };\n\n const handleFinishImport = async () => {\n setInternalLoading(true);\n setContactImportField({\n ...contactImportField,\n description: importName,\n id: generateUniqueId(),\n });\n await onSaveHandler(importName);\n setInternalLoading(false);\n };\n const isFinishDisabled = !isValidInputLength(importName);\n\n\n return (\n <Dialog open>\n <DialogContent\n className=\"dm-sans\"\n css={{\n fontFamily: \"DM Sans !important\",\n 'p': {\n margin: \"0 !important\",\n },\n padding: 0,\n borderRadius: \"$3xl\",\n maxWidth: MODAL_MAX_WIDTH,\n }}\n >\n <Flex\n alignItems=\"center\"\n justifyContent=\"space-between\"\n className=\"dm-sans\"\n css={{\n padding: \"$8 $12\",\n borderBottom: \"$borderWidths$xs solid $neutral200\",\n }}\n >\n <Heading className=\"dm-sans\" size=\"h6\" css={{ color: \"$neutral900\" }}>\n {CONTACT_IMPORT_UI_STRINGS.IMPORT_CONFIGURATION}\n </Heading>\n <IconButton\n variant=\"ghost\"\n color=\"default\"\n disabled={internalLoading}\n icon={<CloseIcon />}\n size=\"lg\"\n css={{\n \"& svg\": {\n color: \"#64748B !important\",\n },\n }}\n onClick={onCloseHandler}\n aria-label=\"Close modal\"\n data-testid={tid('close-modal')}\n />\n </Flex>\n <Box\n className=\"dm-sans\"\n css={{\n padding: \"$12\",\n }}\n >\n <FormInput\n className=\"dm-sans\"\n label={CONTACT_IMPORT_UI_STRINGS.TITLE_LABEL}\n requiredIndicator\n value={contactImportField?.configure?.reference \|\| importName}\n maxLength={INPUT_MAX_LENGTH}\n max={INPUT_MAX_LENGTH}\n showCount\n onChange={handleInputChange}\n size=\"lg\"\n />\n {/* {invitePortal.hasInvitePortal && (\n <Box css={{ marginTop: \"$12\" }}>\n <Checkbox\n checked={!!invitePortal.value}\n onChange={handleInvitePortalChange}\n >\n {CONTACT_IMPORT_UI_STRINGS.INVITE_TO_PORTAL}\n </Checkbox>\n </Box>\n )} */}\n </Box>\n <Flex\n className=\"dm-sans\"\n gap=\"$4\"\n css={{\n justifyContent: \"flex-end\",\n padding: \"$8 $12\",\n }}\n >\n <Button size=\"lg\" color=\"default\" disabled={internalLoading} onClick={onCloseHandler} data-testid={tid('cancel-btn')}>\n {CONTACT_IMPORT_UI_STRINGS.CANCEL}\n </Button>\n <Button\n size=\"lg\"\n disabled={isFinishDisabled \|\| internalLoading}\n onClick={async () => await handleFinishImport()}\n loading={internalLoading}\n data-testid={tid('finish-import')}\n >\n {CONTACT_IMPORT_UI_STRINGS.FINISH_IMPORT}\n </Button>\n </Flex>\n </DialogContent>\n </Dialog>\n );\n};\n\n"],"names":["useTestId","useState","generateUniqueId","isValidInputLength","Dialog","DialogContent","MODAL_MAX_WIDTH","Flex","Heading","CONTACT_IMPORT_UI_STRINGS","IconButton","CloseIcon","Box","FormInput","INPUT_MAX_LENGTH","Button"],"mappings":"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"}

package/dist/cjs/contact-import/components/ManageImport/dashboard.js CHANGED Viewed

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var completed = require('./completed.js');
 var scheduled = require('./scheduled.js');
 var React = require('react');
+var testId_context = require('../../../commons/context/test-id.context.js');
 var NoDataState = require('./NoDataState.js');
 var flex = require('../../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js');
 var box = require('../../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js');
@@ -20,6 +21,7 @@ function Dashboard({
   integrationName,
   imports
 }) {
+  const { tid } = testId_context.useTestId();
   const completedImport = imports.filter(
     (item) => !item.isRecuring
   );
@@ -41,7 +43,8 @@ function Dashboard({
         onClick: () => {
           setNewImport(true);
         },
-        size: "lg"
+        size: "lg",
+        "data-testid": tid("new-import")
       },
       "New Import"
     )

package/dist/cjs/contact-import/components/ManageImport/dashboard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dashboard.js","sources":["../../../../../src/contact-import/components/ManageImport/dashboard.tsx"],"sourcesContent":["import {\n Box,\n Heading,\n Button,\n TabsTrigger,\n Tabs,\n TabsList,\n TabsContent,\n} from \"@sparrowengg/twigs-react\";\nimport { Flex, Text } from \"@sparrowengg/twigs-react\";\nimport Completed from \"./completed\";\nimport Scheduled from \"./scheduled\";\nimport React from \"react\";\nimport NoLogsState from \"./NoDataState\";\nimport { PlusIcon } from \"@sparrowengg/twigs-react-icons\";\nimport { DashboardProps, CompletedImportTypes, ScheduledImportTypes } from \"../../types\";\nexport default function Dashboard({\n dashboardDescription,\n setNewImport,\n integrationName,\n imports,\n}: DashboardProps) {\n const completedImport = imports.filter(\n (item: CompletedImportTypes \| ScheduledImportTypes) =>\n !item.isRecuring\n );\n const scheduledImport = imports.filter(\n (item: CompletedImportTypes \| ScheduledImportTypes) =>\n item.isRecuring\n );\n\n return (\n <Flex justifyContent=\"center\">\n <Box css={{ maxWidth: \"1120px\", width: \"100%\" }}>\n <Flex\n css={{ marginTop: \"$40\" }}\n justifyContent=\"space-between\"\n alignItems=\"center\"\n >\n <Flex flexDirection=\"column\" gap=\"$2\">\n <Heading size=\"h5\">{integrationName}</Heading>\n <Text size=\"sm\" css={{ color: \"$neutral600\" }}>\n {dashboardDescription}\n </Text>\n </Flex>\n <Button leftIcon={<PlusIcon size={20} />}\n onClick={() => {\n setNewImport(true);\n }}\n size=\"lg\"\n >\n New Import\n </Button>\n </Flex>\n <Tabs\n defaultValue=\"completed\"\n css={{\n marginTop: \"$16\",\n padding: \"0 !important\",\n }}\n >\n <TabsList aria-label=\"contact-imports\">\n <TabsTrigger value=\"completed\">Completed </TabsTrigger>\n <TabsTrigger value=\"scheduled\"> Scheduled </TabsTrigger>\n </TabsList>\n <TabsContent value=\"completed\" css={{ padding: \"0\", height: \"100%\" }}>\n {completedImport?.length ? (\n <Completed completed={completedImport} />\n ) : (\n <NoLogsState />\n )}\n </TabsContent>\n <TabsContent css={{ padding: \"0\", height: \"100%\" }} value=\"scheduled\">\n {scheduledImport?.length ? (\n <Scheduled scheduled={scheduledImport} />\n ) : (\n <NoLogsState />\n )}\n </TabsContent>\n </Tabs>\n </Box>\n </Flex>\n );\n}\n"],"names":["Flex","Box","Heading","Text","Button","PlusIcon","Tabs","TabsList","TabsTrigger","TabsContent","Completed","NoLogsState","Scheduled"],"mappings":"~~;;;;;;;;;;;;;;;;AAgBA~~,SAAwB,SAAA,CAAU;AAAA,EAChC,oBAAA;AAAA,EACA,YAAA;AAAA,EACA,eAAA;AAAA,EACA;AACF,CAAA,EAAmB;AACjB,EAAA,MAAM,kBAAkB,OAAA,CAAQ,MAAA;AAAA,IAC9B,CAAC,IAAA,KACC,CAAC,IAAA,CAAK;AAAA,GACV;AACA,EAAA,MAAM,kBAAkB,OAAA,CAAQ,MAAA;AAAA,IAC9B,CAAC,SACC,IAAA,CAAK;AAAA,GACT;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,~~CAACA~~,SAAA,EAAA,EAAK,cAAA,EAAe,QAAA,EAAA,kBACnB,KAAA,CAAA,aAAA,CAACC,OAAA,EAAA,EAAI,GAAA,EAAK,EAAE,QAAA,EAAU,QAAA,EAAU,KAAA,EAAO,MAAA,EAAO,EAAA,kBAC5C,KAAA,CAAA,aAAA;AAAA,IAACD,SAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,EAAE,SAAA,EAAW,KAAA,EAAM;AAAA,MACxB,cAAA,EAAe,eAAA;AAAA,MACf,UAAA,EAAW;AAAA,KAAA;AAAA,oBAEX,KAAA,CAAA,aAAA,CAACA,aAAK,aAAA,EAAc,QAAA,EAAS,KAAI,IAAA,EAAA,kBAC/B,KAAA,CAAA,aAAA,CAACE,eAAA,EAAA,EAAQ,IAAA,EAAK,IAAA,EAAA,EAAM,eAAgB,mBACpC,KAAA,CAAA,aAAA,CAACC,SAAA,EAAA,EAAK,MAAK,IAAA,EAAK,GAAA,EAAK,EAAE,KAAA,EAAO,aAAA,EAAc,EAAA,EACzC,oBACH,CACF,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QAAO,QAAA,kBAAU,KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAS,IAAA,EAAM,EAAA,EAAI,CAAA;AAAA,QACpC,SAAS,MAAM;AACb,UAAA,YAAA,CAAa,IAAI,CAAA;AAAA,QACnB,CAAA;AAAA,QACA,IAAA,EAAK;AAAA,OAAA;AAAA,~~MACN~~;AAAA;AAED,GACF,kBACA,KAAA,CAAA,aAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,YAAA,EAAa,WAAA;AAAA,MACb,GAAA,EAAK;AAAA,QACH,SAAA,EAAW,KAAA;AAAA,QACX,OAAA,EAAS;AAAA;AACX,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAACC,aAAA,EAAA,EAAS,YAAA,EAAW,iBAAA,EAAA,sCAClBC,gBAAA,EAAA,EAAY,KAAA,EAAM,WAAA,EAAA,EAAY,YAAU,mBACzC,KAAA,CAAA,aAAA,CAACA,gBAAA,EAAA,EAAY,KAAA,EAAM,WAAA,EAAA,EAAY,aAAW,CAC5C,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA,CAACC,oBAAY,KAAA,EAAM,WAAA,EAAY,KAAK,EAAE,OAAA,EAAS,KAAK,MAAA,EAAQ,MAAA,OACzD,eAAA,IAAA,IAAA,GAAA,MAAA,GAAA,eAAA,CAAiB,MAAA,wCACfC,iBAAA,EAAA,EAAU,SAAA,EAAW,iBAAiB,CAAA,mBAEvC,KAAA,CAAA,aAAA,CAACC,yBAAY,CAEjB,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA,CAACF,oBAAY,GAAA,EAAK,EAAE,SAAS,GAAA,EAAK,MAAA,EAAQ,QAAO,EAAG,KAAA,EAAM,gBACvD,eAAA,IAAA,IAAA,GAAA,MAAA,GAAA,eAAA,CAAiB,MAAA,wCACfG,iBAAA,EAAA,EAAU,SAAA,EAAW,iBAAiB,CAAA,mBAEvC,KAAA,CAAA,aAAA,CAACD,yBAAY,CAEjB;AAAA,GAEJ,CACF,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"dashboard.js","sources":["../../../../../src/contact-import/components/ManageImport/dashboard.tsx"],"sourcesContent":["import {\n Box,\n Heading,\n Button,\n TabsTrigger,\n Tabs,\n TabsList,\n TabsContent,\n} from \"@sparrowengg/twigs-react\";\nimport { Flex, Text } from \"@sparrowengg/twigs-react\";\nimport Completed from \"./completed\";\nimport Scheduled from \"./scheduled\";\nimport React from \"react\";\nimport { useTestId } from \"../../../commons/context/test-id.context\";\nimport NoLogsState from \"./NoDataState\";\nimport { PlusIcon } from \"@sparrowengg/twigs-react-icons\";\nimport { DashboardProps, CompletedImportTypes, ScheduledImportTypes } from \"../../types\";\nexport default function Dashboard({\n dashboardDescription,\n setNewImport,\n integrationName,\n imports,\n}: DashboardProps) {\n const { tid } = useTestId();\n const completedImport = imports.filter(\n (item: CompletedImportTypes \| ScheduledImportTypes) =>\n !item.isRecuring\n );\n const scheduledImport = imports.filter(\n (item: CompletedImportTypes \| ScheduledImportTypes) =>\n item.isRecuring\n );\n\n return (\n <Flex justifyContent=\"center\">\n <Box css={{ maxWidth: \"1120px\", width: \"100%\" }}>\n <Flex\n css={{ marginTop: \"$40\" }}\n justifyContent=\"space-between\"\n alignItems=\"center\"\n >\n <Flex flexDirection=\"column\" gap=\"$2\">\n <Heading size=\"h5\">{integrationName}</Heading>\n <Text size=\"sm\" css={{ color: \"$neutral600\" }}>\n {dashboardDescription}\n </Text>\n </Flex>\n <Button leftIcon={<PlusIcon size={20} />}\n onClick={() => {\n setNewImport(true);\n }}\n size=\"lg\"\n data-testid={tid('new-import')}\n >\n New Import\n </Button>\n </Flex>\n <Tabs\n defaultValue=\"completed\"\n css={{\n marginTop: \"$16\",\n padding: \"0 !important\",\n }}\n >\n <TabsList aria-label=\"contact-imports\">\n <TabsTrigger value=\"completed\">Completed </TabsTrigger>\n <TabsTrigger value=\"scheduled\"> Scheduled </TabsTrigger>\n </TabsList>\n <TabsContent value=\"completed\" css={{ padding: \"0\", height: \"100%\" }}>\n {completedImport?.length ? (\n <Completed completed={completedImport} />\n ) : (\n <NoLogsState />\n )}\n </TabsContent>\n <TabsContent css={{ padding: \"0\", height: \"100%\" }} value=\"scheduled\">\n {scheduledImport?.length ? (\n <Scheduled scheduled={scheduledImport} />\n ) : (\n <NoLogsState />\n )}\n </TabsContent>\n </Tabs>\n </Box>\n </Flex>\n );\n}\n"],"names":["useTestId","Flex","Box","Heading","Text","Button","PlusIcon","Tabs","TabsList","TabsTrigger","TabsContent","Completed","NoLogsState","Scheduled"],"mappings":"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"}