@sparrowengg/integrations-templates-frontend 1.9.84-beta.9 → 2.1.0-beta.1

package/dist/es/contact-import/components/ManageImport/Completed.js

@@ -0,0 +1,59 @@
+import React__default, { useState } from 'react';
+import moment from '../../../node_modules/moment/moment.js';
+import { COMPLETED_TABLE_COLUMNS, DATE_FORMAT, LABELS } from '../../constants/index.js';
+import { TooltipProvider } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js';
+import { Box } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
+import { Grid } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/grid/grid.js';
+import { Text } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { TickCircleFillIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/tick-circle-fill.js';
+import { AlertFillIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/alert-fill.js';
+import { Flex } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/dropdown/dropdown.js';
+import { IconButton } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/button/icon-button.js';
+import { EllipsisVerticalIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/ellipsis-vertical.js';
+import { DeleteIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/delete.js';
+
+const Completed = ({ completed }) => {
+  const [hoveredRowId, setHoveredRowId] = useState(null);
+  return /* @__PURE__ */ React__default.createElement(TooltipProvider, null, /* @__PURE__ */ React__default.createElement(Box, { css: { width: "100%", height: "100%", overflow: "scroll" } }, /* @__PURE__ */ React__default.createElement(
+    Grid,
+    {
+      templateColumns: COMPLETED_TABLE_COLUMNS.map((col) => col.width).join(" "),
+      css: {
+        borderTop: "$borderWidths$xs solid $neutral200",
+        borderBottom: "$borderWidths$xs solid $neutral200",
+        padding: "$7 $12",
+        color: "$neutral900",
+        alignItems: "center",
+        position: "sticky",
+        top: "0",
+        background: "white",
+        zIndex: "2"
+      }
+    },
+    COMPLETED_TABLE_COLUMNS.map((column) => /* @__PURE__ */ React__default.createElement(Text, { key: column.key, weight: "medium" }, column.label))
+  ), completed.map((item) => /* @__PURE__ */ React__default.createElement(
+    Grid,
+    {
+      key: item.id,
+      onMouseEnter: () => setHoveredRowId(item.id),
+      onMouseLeave: () => setHoveredRowId(null),
+      templateColumns: COMPLETED_TABLE_COLUMNS.map((col) => col.width).join(" "),
+      css: {
+        borderBottom: "$borderWidths$xs solid $neutral100",
+        padding: "$9 $12",
+        fontWeight: "$4",
+        color: "$neutral700",
+        alignItems: "center"
+      }
+    },
+    /* @__PURE__ */ React__default.createElement(Text, { weight: "bold", css: { color: "$neutral900" } }, item.name),
+    /* @__PURE__ */ React__default.createElement(Text, { css: { color: "$neutral900" } }, item.type),
+    /* @__PURE__ */ React__default.createElement(Text, null, item.importedOn ? moment(item.importedOn).format(DATE_FORMAT.DISPLAY) : "-"),
+    /* @__PURE__ */ React__default.createElement(Text, null, item.status === "success" ? /* @__PURE__ */ React__default.createElement(TickCircleFillIcon, { color: "#5EA130", size: 24 }) : /* @__PURE__ */ React__default.createElement(AlertFillIcon, { color: "#F65633", size: 24 })),
+    /* @__PURE__ */ React__default.createElement(Flex, { justifyContent: "center" }, hoveredRowId === item.id && /* @__PURE__ */ React__default.createElement(DropdownMenu, { size: "sm" }, /* @__PURE__ */ React__default.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(IconButton, { size: "md", variant: "ghost", color: "secondary", icon: /* @__PURE__ */ React__default.createElement(EllipsisVerticalIcon, null) })), /* @__PURE__ */ React__default.createElement(DropdownMenuContent, { onCloseAutoFocus: (e) => e.preventDefault(), side: "bottom", align: "end", css: { minWidth: "128px", padding: "$4 0" } }, /* @__PURE__ */ React__default.createElement(DropdownMenuItem, { css: { cursor: "pointer" } }, /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React__default.createElement(DeleteIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, LABELS.DELETE))))))
+  ))));
+};
+
+export { Completed as default };
+//# sourceMappingURL=Completed.js.map

package/dist/es/contact-import/components/ManageImport/Completed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Completed.js","sources":["../../../../../src/contact-import/components/ManageImport/Completed.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n  Box,\n  Grid,\n  Text,\n  TooltipProvider,\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n  IconButton,\n  Flex,\n} from '@sparrowengg/twigs-react';\nimport moment from 'moment';\nimport {\n  AlertFillIcon,\n  DeleteIcon,\n  EllipsisVerticalIcon,\n  TickCircleFillIcon,\n} from '@sparrowengg/twigs-react-icons';\nimport { CompletedImportsProps } from '../../types';\nimport { COMPLETED_TABLE_COLUMNS, DATE_FORMAT, LABELS } from '../../constants';\n\nconst Completed: React.FC<CompletedImportsProps> = ({ completed }) => {\n  const [hoveredRowId, setHoveredRowId] = useState<string | null>(null);\n\n  return (\n    <TooltipProvider>\n      <Box css={{ width: '100%', height: '100%', overflow: 'scroll' }}>\n        <Grid\n          templateColumns={COMPLETED_TABLE_COLUMNS.map((col) => col.width).join(' ')}\n          css={{\n            borderTop: '$borderWidths$xs solid $neutral200',\n            borderBottom: '$borderWidths$xs solid $neutral200',\n            padding: '$7 $12',\n            color: '$neutral900',\n            alignItems: 'center',\n            position: 'sticky',\n            top: '0',\n            background: 'white',\n            zIndex: '2',\n          }}\n        >\n          {COMPLETED_TABLE_COLUMNS.map((column) => (\n            <Text key={column.key} weight=\"medium\">{column.label}</Text>\n          ))}\n        </Grid>\n        {completed.map((item) => (\n          <Grid\n            key={item.id}\n            onMouseEnter={() => setHoveredRowId(item.id)}\n            onMouseLeave={() => setHoveredRowId(null)}\n            templateColumns={COMPLETED_TABLE_COLUMNS.map((col) => col.width).join(' ')}\n            css={{\n              borderBottom: '$borderWidths$xs solid $neutral100',\n              padding: '$9 $12',\n              fontWeight: '$4',\n              color: '$neutral700',\n              alignItems: 'center',\n            }}\n          >\n            <Text weight=\"bold\" css={{ color: '$neutral900' }}>{item.name}</Text>\n            <Text css={{ color: '$neutral900' }}>{item.type}</Text>\n            <Text>{item.importedOn ? moment(item.importedOn).format(DATE_FORMAT.DISPLAY) : '-'}</Text>\n            <Text>\n              {item.status === 'success' ? (\n                <TickCircleFillIcon color=\"#5EA130\" size={24} />\n              ) : (\n                <AlertFillIcon color=\"#F65633\" size={24} />\n              )}\n            </Text>\n            <Flex justifyContent=\"center\">\n              {hoveredRowId === item.id && (\n                <DropdownMenu size=\"sm\">\n                  <DropdownMenuTrigger asChild>\n                    <IconButton size=\"md\" variant=\"ghost\" color=\"secondary\" icon={<EllipsisVerticalIcon />} />\n                  </DropdownMenuTrigger>\n                  <DropdownMenuContent onCloseAutoFocus={(e) => e.preventDefault()} side=\"bottom\" align=\"end\" css={{ minWidth: '128px', padding: '$4 0' }}>\n                    <DropdownMenuItem css={{ cursor: 'pointer' }}>\n                      <Flex alignItems=\"center\" gap=\"$2\">\n                        <DeleteIcon color=\"#6A6A6A\" size={20} />\n                        <Text size=\"sm\">{LABELS.DELETE}</Text>\n                      </Flex>\n                    </DropdownMenuItem>\n                  </DropdownMenuContent>\n                </DropdownMenu>\n              )}\n            </Flex>\n          </Grid>\n        ))}\n      </Box>\n    </TooltipProvider>\n  );\n};\n\nexport default Completed;\n"],"names":["React"],"mappings":"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"}

package/dist/es/contact-import/components/ManageImport/Dashboard.js

@@ -0,0 +1,40 @@
+import React__default, { useMemo } from 'react';
+import Completed from './Completed.js';
+import Scheduled from './Scheduled.js';
+import NoDataState from './NoDataState.js';
+import { isScheduledImport } from '../../types/index.js';
+import { UI_CONSTANTS, LABELS } from '../../constants/index.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 { 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 { Tabs, TabsList, TabsTrigger, TabsContent } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/tabs/tabs.js';
+
+const Dashboard = ({
+  dashboardDescription,
+  setNewImport,
+  integrationName,
+  imports
+}) => {
+  const { completedImports, scheduledImports } = useMemo(() => {
+    const completed = [];
+    const scheduled = [];
+    imports.forEach((importItem) => {
+      if (isScheduledImport(importItem)) {
+        scheduled.push(importItem);
+      } else {
+        completed.push(importItem);
+      }
+    });
+    return {
+      completedImports: completed,
+      scheduledImports: scheduled
+    };
+  }, [imports]);
+  return /* @__PURE__ */ React__default.createElement(Flex, { justifyContent: "center" }, /* @__PURE__ */ React__default.createElement(Box, { css: { maxWidth: UI_CONSTANTS.DASHBOARD_MAX_WIDTH, width: "100%" } }, /* @__PURE__ */ React__default.createElement(Flex, { css: { marginTop: "$40" }, justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React__default.createElement(Flex, { flexDirection: "column", gap: "$2" }, /* @__PURE__ */ React__default.createElement(Heading, { size: "h5" }, integrationName), /* @__PURE__ */ React__default.createElement(Text, { size: "sm", css: { color: "$neutral600" } }, dashboardDescription)), /* @__PURE__ */ React__default.createElement(Button, { leftIcon: /* @__PURE__ */ React__default.createElement(PlusIcon, { size: 20 }), onClick: () => setNewImport(true), size: "lg" }, LABELS.NEW_IMPORT)), /* @__PURE__ */ React__default.createElement(Tabs, { defaultValue: "completed", css: { marginTop: "$16", padding: "0 !important" } }, /* @__PURE__ */ React__default.createElement(TabsList, { "aria-label": LABELS.CONTACT_IMPORTS }, /* @__PURE__ */ React__default.createElement(TabsTrigger, { value: "completed" }, LABELS.COMPLETED), /* @__PURE__ */ React__default.createElement(TabsTrigger, { value: "scheduled" }, LABELS.SCHEDULED)), /* @__PURE__ */ React__default.createElement(TabsContent, { value: "completed", css: { padding: "0", height: "100%" } }, completedImports.length > 0 ? /* @__PURE__ */ React__default.createElement(Completed, { completed: completedImports }) : /* @__PURE__ */ React__default.createElement(NoDataState, null)), /* @__PURE__ */ React__default.createElement(TabsContent, { value: "scheduled", css: { padding: "0", height: "100%" } }, scheduledImports.length > 0 ? /* @__PURE__ */ React__default.createElement(Scheduled, { scheduled: scheduledImports }) : /* @__PURE__ */ React__default.createElement(NoDataState, null)))));
+};
+
+export { Dashboard as default };
+//# sourceMappingURL=Dashboard.js.map

package/dist/es/contact-import/components/ManageImport/Dashboard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard.js","sources":["../../../../../src/contact-import/components/ManageImport/Dashboard.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport {\n  Box,\n  Heading,\n  Button,\n  TabsTrigger,\n  Tabs,\n  TabsList,\n  TabsContent,\n  Flex,\n  Text,\n} from '@sparrowengg/twigs-react';\nimport { PlusIcon } from '@sparrowengg/twigs-react-icons';\nimport Completed from './Completed';\nimport Scheduled from './Scheduled';\nimport NoDataState from './NoDataState';\nimport { DashboardProps, CompletedImport, ScheduledImport } from '../../types';\nimport { isScheduledImport } from '../../types';\nimport { UI_CONSTANTS, LABELS } from '../../constants';\n\nconst Dashboard: React.FC<DashboardProps> = ({\n  dashboardDescription,\n  setNewImport,\n  integrationName,\n  imports,\n}) => {\n  const { completedImports, scheduledImports } = useMemo(() => {\n    const completed: CompletedImport[] = [];\n    const scheduled: ScheduledImport[] = [];\n    imports.forEach((importItem) => {\n      if (isScheduledImport(importItem)) {\n        scheduled.push(importItem);\n      } else {\n        completed.push(importItem);\n      }\n    });\n    return {\n      completedImports: completed,\n      scheduledImports: scheduled,\n    };\n  }, [imports]);\n\n  return (\n    <Flex justifyContent=\"center\">\n      <Box css={{ maxWidth: UI_CONSTANTS.DASHBOARD_MAX_WIDTH, width: '100%' }}>\n        <Flex css={{ marginTop: '$40' }} justifyContent=\"space-between\" alignItems=\"center\">\n          <Flex flexDirection=\"column\" gap=\"$2\">\n            <Heading size=\"h5\">{integrationName}</Heading>\n            <Text size=\"sm\" css={{ color: '$neutral600' }}>{dashboardDescription}</Text>\n          </Flex>\n          <Button leftIcon={<PlusIcon size={20} />} onClick={() => setNewImport(true)} size=\"lg\">\n            {LABELS.NEW_IMPORT}\n          </Button>\n        </Flex>\n        <Tabs defaultValue=\"completed\" css={{ marginTop: '$16', padding: '0 !important' }}>\n          <TabsList aria-label={LABELS.CONTACT_IMPORTS}>\n            <TabsTrigger value=\"completed\">{LABELS.COMPLETED}</TabsTrigger>\n            <TabsTrigger value=\"scheduled\">{LABELS.SCHEDULED}</TabsTrigger>\n          </TabsList>\n          <TabsContent value=\"completed\" css={{ padding: '0', height: '100%' }}>\n            {completedImports.length > 0 ? <Completed completed={completedImports} /> : <NoDataState />}\n          </TabsContent>\n          <TabsContent value=\"scheduled\" css={{ padding: '0', height: '100%' }}>\n            {scheduledImports.length > 0 ? <Scheduled scheduled={scheduledImports} /> : <NoDataState />}\n          </TabsContent>\n        </Tabs>\n      </Box>\n    </Flex>\n  );\n};\n\nexport default Dashboard;\n"],"names":["React"],"mappings":"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"}

package/dist/es/contact-import/components/ManageImport/Icons.js

@@ -0,0 +1,89 @@
+import React__default from 'react';
+
+const GradientSVG = ({
+  color = "#978CF9"
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "190",
+      height: "105",
+      fill: "none",
+      viewBox: "0 0 190 105"
+    },
+    /* @__PURE__ */ React__default.createElement("g", { filter: "url(#filter0_f_464_5408)", opacity: "0.5" }, /* @__PURE__ */ React__default.createElement(
+      "path",
+      {
+        d: "M94.802 48.24c-25.851 0-46.802 25.075-46.802 56h93.604c0-30.925-20.951-56-46.802-56z",
+        fill: color
+      }
+    )),
+    /* @__PURE__ */ React__default.createElement("defs", null, /* @__PURE__ */ React__default.createElement(
+      "filter",
+      {
+        id: "filter0_f_464_5408",
+        width: "189.604",
+        height: "104",
+        x: "0",
+        y: "0.24",
+        colorInterpolationFilters: "sRGB",
+        filterUnits: "userSpaceOnUse"
+      },
+      /* @__PURE__ */ React__default.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+      /* @__PURE__ */ React__default.createElement(
+        "feBlend",
+        {
+          in: "SourceGraphic",
+          in2: "BackgroundImageFix",
+          result: "shape"
+        }
+      ),
+      /* @__PURE__ */ React__default.createElement(
+        "feGaussianBlur",
+        {
+          result: "effect1_foregroundBlur_464_5408",
+          stdDeviation: "24"
+        }
+      )
+    ))
+  );
+};
+const DocumentClipSVG = ({
+  size = "48",
+  color = "#7158F5"
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: size,
+      height: size,
+      fill: "none",
+      viewBox: "0 0 48 48"
+    },
+    /* @__PURE__ */ React__default.createElement(
+      "path",
+      {
+        stroke: color,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "2",
+        d: "M40 20V10a4 4 0 00-4-4H10a4 4 0 00-4 4v28a4 4 0 004 4h14M14 16h18m-18 8h8m-8 8h6"
+      }
+    ),
+    /* @__PURE__ */ React__default.createElement(
+      "path",
+      {
+        stroke: color,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "2",
+        d: "M30 29.55a5.24 5.24 0 011.89-2.978 5.061 5.061 0 013.318-1.064 4.964 4.964 0 013.616 1.286 5.162 5.162 0 011.676 3.51c0 3.608-5.057 4.798-5.057 7.196M35.675 41.77a.112.112 0 100 .224.112.112 0 000-.224"
+      }
+    )
+  );
+};
+
+export { DocumentClipSVG, GradientSVG };
+//# sourceMappingURL=Icons.js.map

package/dist/es/contact-import/components/ManageImport/Icons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icons.js","sources":["../../../../../src/contact-import/components/ManageImport/Icons.tsx"],"sourcesContent":["import React from 'react';\n\ninterface GradientSVGProps {\n  color?: string;\n}\n\ninterface DocumentClipSVGProps {\n  size?: string;\n  color?: string;\n}\n\n/**\n * Gradient background SVG for empty state\n */\nexport const GradientSVG: React.FC<GradientSVGProps> = ({\n  color = '#978CF9',\n}) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"190\"\n      height=\"105\"\n      fill=\"none\"\n      viewBox=\"0 0 190 105\"\n    >\n      <g filter=\"url(#filter0_f_464_5408)\" opacity=\"0.5\">\n        <path\n          d=\"M94.802 48.24c-25.851 0-46.802 25.075-46.802 56h93.604c0-30.925-20.951-56-46.802-56z\"\n          fill={color}\n        />\n      </g>\n      <defs>\n        <filter\n          id=\"filter0_f_464_5408\"\n          width=\"189.604\"\n          height=\"104\"\n          x=\"0\"\n          y=\"0.24\"\n          colorInterpolationFilters=\"sRGB\"\n          filterUnits=\"userSpaceOnUse\"\n        >\n          <feFlood floodOpacity=\"0\" result=\"BackgroundImageFix\" />\n          <feBlend\n            in=\"SourceGraphic\"\n            in2=\"BackgroundImageFix\"\n            result=\"shape\"\n          />\n          <feGaussianBlur\n            result=\"effect1_foregroundBlur_464_5408\"\n            stdDeviation=\"24\"\n          />\n        </filter>\n      </defs>\n    </svg>\n  );\n};\n\n/**\n * Document clip icon SVG for empty state\n */\nexport const DocumentClipSVG: React.FC<DocumentClipSVGProps> = ({\n  size = '48',\n  color = '#7158F5',\n}) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      fill=\"none\"\n      viewBox=\"0 0 48 48\"\n    >\n      <path\n        stroke={color}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth=\"2\"\n        d=\"M40 20V10a4 4 0 00-4-4H10a4 4 0 00-4 4v28a4 4 0 004 4h14M14 16h18m-18 8h8m-8 8h6\"\n      />\n      <path\n        stroke={color}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth=\"2\"\n        d=\"M30 29.55a5.24 5.24 0 011.89-2.978 5.061 5.061 0 013.318-1.064 4.964 4.964 0 013.616 1.286 5.162 5.162 0 011.676 3.51c0 3.608-5.057 4.798-5.057 7.196M35.675 41.77a.112.112 0 100 .224.112.112 0 000-.224\"\n      />\n    </svg>\n  );\n};\n\n"],"names":["React"],"mappings":";;AAcO,MAAM,cAA0C,CAAC;AAAA,EACtD,KAAQ,GAAA,SAAA;AACV,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,4BAAA;AAAA,MACN,KAAM,EAAA,KAAA;AAAA,MACN,MAAO,EAAA,KAAA;AAAA,MACP,IAAK,EAAA,MAAA;AAAA,MACL,OAAQ,EAAA,aAAA;AAAA,KAAA;AAAA,oBAEPA,cAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAE,MAAO,EAAA,0BAAA,EAA2B,SAAQ,KAC3C,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,sFAAA;AAAA,QACF,IAAM,EAAA,KAAA;AAAA,OAAA;AAAA,KAEV,CAAA;AAAA,iDACC,MACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,EAAG,EAAA,oBAAA;AAAA,QACH,KAAM,EAAA,SAAA;AAAA,QACN,MAAO,EAAA,KAAA;AAAA,QACP,CAAE,EAAA,GAAA;AAAA,QACF,CAAE,EAAA,MAAA;AAAA,QACF,yBAA0B,EAAA,MAAA;AAAA,QAC1B,WAAY,EAAA,gBAAA;AAAA,OAAA;AAAA,sBAEXA,cAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAQ,YAAa,EAAA,GAAA,EAAI,QAAO,oBAAqB,EAAA,CAAA;AAAA,sBACtDA,cAAA,CAAA,aAAA;AAAA,QAAC,SAAA;AAAA,QAAA;AAAA,UACC,EAAG,EAAA,eAAA;AAAA,UACH,GAAI,EAAA,oBAAA;AAAA,UACJ,MAAO,EAAA,OAAA;AAAA,SAAA;AAAA,OACT;AAAA,sBACAA,cAAA,CAAA,aAAA;AAAA,QAAC,gBAAA;AAAA,QAAA;AAAA,UACC,MAAO,EAAA,iCAAA;AAAA,UACP,YAAa,EAAA,IAAA;AAAA,SAAA;AAAA,OACf;AAAA,KAEJ,CAAA;AAAA,GACF,CAAA;AAEJ,EAAA;AAKO,MAAM,kBAAkD,CAAC;AAAA,EAC9D,IAAO,GAAA,IAAA;AAAA,EACP,KAAQ,GAAA,SAAA;AACV,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,4BAAA;AAAA,MACN,KAAO,EAAA,IAAA;AAAA,MACP,MAAQ,EAAA,IAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,OAAQ,EAAA,WAAA;AAAA,KAAA;AAAA,oBAERA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,MAAQ,EAAA,KAAA;AAAA,QACR,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,QACf,WAAY,EAAA,GAAA;AAAA,QACZ,CAAE,EAAA,kFAAA;AAAA,OAAA;AAAA,KACJ;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,MAAQ,EAAA,KAAA;AAAA,QACR,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,QACf,WAAY,EAAA,GAAA;AAAA,QACZ,CAAE,EAAA,2MAAA;AAAA,OAAA;AAAA,KACJ;AAAA,GACF,CAAA;AAEJ;;;;"}

package/dist/es/contact-import/components/ManageImport/NoDataState.js

@@ -1,10 +1,11 @@
 import React__default from 'react';
-import { DocumentClipSVG, GradientSVG } from './icon.js';
+import { DocumentClipSVG, GradientSVG } from './Icons.js';
+import { LABELS } from '../../constants/index.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 { Text } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
 
-const NoLogsState = () => {
+const NoDataState = () => {
   return /* @__PURE__ */ React__default.createElement(
     Flex,
     {
@@ -69,10 +70,10 @@ const NoLogsState = () => {
           zIndex: "2"
         }
       },
-      /* @__PURE__ */ React__default.createElement(Text, { size: "md", css: { color: "$neutral800", textAlign: "center" } }, "There are no imports created yet!")
+      /* @__PURE__ */ React__default.createElement(Text, { size: "md", css: { color: "$neutral800", textAlign: "center" } }, LABELS.NO_IMPORTS_MESSAGE)
     ))
   );
 };
 
-export { NoLogsState as default };
+export { NoDataState as default };
 //# sourceMappingURL=NoDataState.js.map

package/dist/es/contact-import/components/ManageImport/NoDataState.js.map

@@ -1 +1 @@
-{"version":3,"file":"NoDataState.js","sources":["../../../../../src/contact-import/components/ManageImport/NoDataState.tsx"],"sourcesContent":["import React from \"react\";\nimport { Box, Flex, Text } from \"@sparrowengg/twigs-react\";\nimport { DocumentClipSVG, GradientSVG } from \"./icon\";\nconst NoLogsState = () => {\n  return (\n    <Flex\n      css={{\n        width: \"100%\",\n        height: \"calc(100vh - 500px)\",\n        background: \"$white900\",\n      }}\n      flexDirection=\"column\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n    >\n      <Flex flexDirection=\"column\" css={{ width: \"480px\" }}>\n        <Flex\n          flexDirection=\"column\"\n          alignItems=\"center\"\n          css={{ position: \"relative\" }}\n        >\n          <Flex\n            alignItems=\"center\"\n            justifyContent=\"center\"\n            css={{\n              width: \"$20\",\n              height: \"$19\",\n              borderRadius: \"$2xl $2xl 0 0\",\n              borderBottom: \"0 !important\",\n              borderWidth: \"$borderWidths$xs\",\n              borderStyle: \"solid\",\n              borderColorOpacity: [\"$accent500\", 0.06],\n              zIndex: \"2\",\n              background: \"$white900\",\n            }}\n          >\n            <DocumentClipSVG />\n          </Flex>\n          <Box\n            css={{\n              width: \"480px\",\n              borderBottom: \"$borderWidths$xs solid #7158F50F\",\n              position: \"absolute\",\n              zIndex: \"3\",\n              bottom: \"-1px\",\n            }}\n          />\n          <Box css={{ position: \"absolute\", top: \"0\" }}>\n            <GradientSVG />\n          </Box>\n        </Flex>\n        <Flex\n          flexDirection=\"column\"\n          alignItems=\"center\"\n          gap=\"$8\"\n          css={{\n            width: \"100%\",\n            background: \"$white900\",\n            padding: \"$16 0\",\n            zIndex: \"2\",\n          }}\n        >\n          <Text size=\"md\" css={{ color: \"$neutral800\", textAlign: \"center\" }}>\n            There are no imports created yet!\n          </Text>\n        </Flex>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default NoLogsState;\n"],"names":["React"],"mappings":";;;;;;AAGA,MAAM,cAAc,MAAM;AACxB,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,MAAA;AAAA,QACP,MAAQ,EAAA,qBAAA;AAAA,QACR,UAAY,EAAA,WAAA;AAAA,OACd;AAAA,MACA,aAAc,EAAA,QAAA;AAAA,MACd,UAAW,EAAA,QAAA;AAAA,MACX,cAAe,EAAA,QAAA;AAAA,KAAA;AAAA,oBAEfA,cAAA,CAAA,aAAA,CAAC,QAAK,aAAc,EAAA,QAAA,EAAS,KAAK,EAAE,KAAA,EAAO,SACzC,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,aAAc,EAAA,QAAA;AAAA,QACd,UAAW,EAAA,QAAA;AAAA,QACX,GAAA,EAAK,EAAE,QAAA,EAAU,UAAW,EAAA;AAAA,OAAA;AAAA,sBAE5BA,cAAA,CAAA,aAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,UAAW,EAAA,QAAA;AAAA,UACX,cAAe,EAAA,QAAA;AAAA,UACf,GAAK,EAAA;AAAA,YACH,KAAO,EAAA,KAAA;AAAA,YACP,MAAQ,EAAA,KAAA;AAAA,YACR,YAAc,EAAA,eAAA;AAAA,YACd,YAAc,EAAA,cAAA;AAAA,YACd,WAAa,EAAA,kBAAA;AAAA,YACb,WAAa,EAAA,OAAA;AAAA,YACb,kBAAA,EAAoB,CAAC,YAAA,EAAc,IAAI,CAAA;AAAA,YACvC,MAAQ,EAAA,GAAA;AAAA,YACR,UAAY,EAAA,WAAA;AAAA,WACd;AAAA,SAAA;AAAA,qDAEC,eAAgB,EAAA,IAAA,CAAA;AAAA,OACnB;AAAA,sBACAA,cAAA,CAAA,aAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UACC,GAAK,EAAA;AAAA,YACH,KAAO,EAAA,OAAA;AAAA,YACP,YAAc,EAAA,kCAAA;AAAA,YACd,QAAU,EAAA,UAAA;AAAA,YACV,MAAQ,EAAA,GAAA;AAAA,YACR,MAAQ,EAAA,MAAA;AAAA,WACV;AAAA,SAAA;AAAA,OACF;AAAA,sBACAA,cAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,GAAA,EAAK,EAAE,QAAA,EAAU,UAAY,EAAA,GAAA,EAAK,GAAI,EAAA,EAAA,kBACxCA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAY,CACf,CAAA;AAAA,KAEF,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,aAAc,EAAA,QAAA;AAAA,QACd,UAAW,EAAA,QAAA;AAAA,QACX,GAAI,EAAA,IAAA;AAAA,QACJ,GAAK,EAAA;AAAA,UACH,KAAO,EAAA,MAAA;AAAA,UACP,UAAY,EAAA,WAAA;AAAA,UACZ,OAAS,EAAA,OAAA;AAAA,UACT,MAAQ,EAAA,GAAA;AAAA,SACV;AAAA,OAAA;AAAA,sBAEAA,cAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,IAAK,EAAA,GAAA,EAAK,EAAE,KAAA,EAAO,aAAe,EAAA,SAAA,EAAW,QAAS,EAAA,EAAA,EAAG,mCAEpE,CAAA;AAAA,KAEJ,CAAA;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"NoDataState.js","sources":["../../../../../src/contact-import/components/ManageImport/NoDataState.tsx"],"sourcesContent":["import React from 'react';\nimport { Box, Flex, Text } from '@sparrowengg/twigs-react';\nimport { DocumentClipSVG, GradientSVG } from './Icons';\nimport { LABELS } from '../../constants';\n\n/**\n * Empty state component displayed when there are no imports\n */\nconst NoDataState: React.FC = () => {\n  return (\n    <Flex\n      css={{\n        width: '100%',\n        height: 'calc(100vh - 500px)',\n        background: '$white900',\n      }}\n      flexDirection=\"column\"\n      alignItems=\"center\"\n      justifyContent=\"center\"\n    >\n      <Flex flexDirection=\"column\" css={{ width: '480px' }}>\n        {/* Icon Container */}\n        <Flex\n          flexDirection=\"column\"\n          alignItems=\"center\"\n          css={{ position: 'relative' }}\n        >\n          <Flex\n            alignItems=\"center\"\n            justifyContent=\"center\"\n            css={{\n              width: '$20',\n              height: '$19',\n              borderRadius: '$2xl $2xl 0 0',\n              borderBottom: '0 !important',\n              borderWidth: '$borderWidths$xs',\n              borderStyle: 'solid',\n              borderColorOpacity: ['$accent500', 0.06],\n              zIndex: '2',\n              background: '$white900',\n            }}\n          >\n            <DocumentClipSVG />\n          </Flex>\n\n          {/* Divider Line */}\n          <Box\n            css={{\n              width: '480px',\n              borderBottom: '$borderWidths$xs solid #7158F50F',\n              position: 'absolute',\n              zIndex: '3',\n              bottom: '-1px',\n            }}\n          />\n\n          {/* Background Gradient */}\n          <Box css={{ position: 'absolute', top: '0' }}>\n            <GradientSVG />\n          </Box>\n        </Flex>\n\n        {/* Message Container */}\n        <Flex\n          flexDirection=\"column\"\n          alignItems=\"center\"\n          gap=\"$8\"\n          css={{\n            width: '100%',\n            background: '$white900',\n            padding: '$16 0',\n            zIndex: '2',\n          }}\n        >\n          <Text size=\"md\" css={{ color: '$neutral800', textAlign: 'center' }}>\n            {LABELS.NO_IMPORTS_MESSAGE}\n          </Text>\n        </Flex>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default NoDataState;\n"],"names":["React"],"mappings":";;;;;;;AAQA,MAAM,cAAwB,MAAM;AAClC,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA;AAAA,QACH,KAAO,EAAA,MAAA;AAAA,QACP,MAAQ,EAAA,qBAAA;AAAA,QACR,UAAY,EAAA,WAAA;AAAA,OACd;AAAA,MACA,aAAc,EAAA,QAAA;AAAA,MACd,UAAW,EAAA,QAAA;AAAA,MACX,cAAe,EAAA,QAAA;AAAA,KAAA;AAAA,oBAEfA,cAAA,CAAA,aAAA,CAAC,QAAK,aAAc,EAAA,QAAA,EAAS,KAAK,EAAE,KAAA,EAAO,SAEzC,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,aAAc,EAAA,QAAA;AAAA,QACd,UAAW,EAAA,QAAA;AAAA,QACX,GAAA,EAAK,EAAE,QAAA,EAAU,UAAW,EAAA;AAAA,OAAA;AAAA,sBAE5BA,cAAA,CAAA,aAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,UAAW,EAAA,QAAA;AAAA,UACX,cAAe,EAAA,QAAA;AAAA,UACf,GAAK,EAAA;AAAA,YACH,KAAO,EAAA,KAAA;AAAA,YACP,MAAQ,EAAA,KAAA;AAAA,YACR,YAAc,EAAA,eAAA;AAAA,YACd,YAAc,EAAA,cAAA;AAAA,YACd,WAAa,EAAA,kBAAA;AAAA,YACb,WAAa,EAAA,OAAA;AAAA,YACb,kBAAA,EAAoB,CAAC,YAAA,EAAc,IAAI,CAAA;AAAA,YACvC,MAAQ,EAAA,GAAA;AAAA,YACR,UAAY,EAAA,WAAA;AAAA,WACd;AAAA,SAAA;AAAA,qDAEC,eAAgB,EAAA,IAAA,CAAA;AAAA,OACnB;AAAA,sBAGAA,cAAA,CAAA,aAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UACC,GAAK,EAAA;AAAA,YACH,KAAO,EAAA,OAAA;AAAA,YACP,YAAc,EAAA,kCAAA;AAAA,YACd,QAAU,EAAA,UAAA;AAAA,YACV,MAAQ,EAAA,GAAA;AAAA,YACR,MAAQ,EAAA,MAAA;AAAA,WACV;AAAA,SAAA;AAAA,OACF;AAAA,sBAGAA,cAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,GAAA,EAAK,EAAE,QAAA,EAAU,UAAY,EAAA,GAAA,EAAK,GAAI,EAAA,EAAA,kBACxCA,cAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAY,CACf,CAAA;AAAA,KAIF,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,aAAc,EAAA,QAAA;AAAA,QACd,UAAW,EAAA,QAAA;AAAA,QACX,GAAI,EAAA,IAAA;AAAA,QACJ,GAAK,EAAA;AAAA,UACH,KAAO,EAAA,MAAA;AAAA,UACP,UAAY,EAAA,WAAA;AAAA,UACZ,OAAS,EAAA,OAAA;AAAA,UACT,MAAQ,EAAA,GAAA;AAAA,SACV;AAAA,OAAA;AAAA,sBAECA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,IAAK,EAAA,IAAA,EAAK,GAAK,EAAA,EAAE,KAAO,EAAA,aAAA,EAAe,SAAW,EAAA,QAAA,EACrD,EAAA,EAAA,MAAA,CAAO,kBACV,CAAA;AAAA,KAEJ,CAAA;AAAA,GACF,CAAA;AAEJ;;;;"}

package/dist/es/contact-import/components/ManageImport/Scheduled.js

@@ -0,0 +1,63 @@
+import React__default, { useState } from 'react';
+import moment from '../../../node_modules/moment/moment.js';
+import { SCHEDULED_TABLE_COLUMNS, DATE_FORMAT, LABELS } from '../../constants/index.js';
+import { TooltipProvider } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/tooltip/tooltip.js';
+import { Box } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
+import { Grid } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/grid/grid.js';
+import { Text } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { Switch } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/switch/switch.js';
+import { TickCircleFillIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/tick-circle-fill.js';
+import { AlertFillIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/alert-fill.js';
+import { Flex } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/dropdown/dropdown.js';
+import { IconButton } from '../../../node_modules/@sparrowengg/twigs-react/dist/es/button/icon-button.js';
+import { EllipsisVerticalIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/ellipsis-vertical.js';
+import { PencilIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/pencil.js';
+import { DeleteIcon } from '../../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/delete.js';
+
+const Scheduled = ({ scheduled }) => {
+  const [hoveredRowId, setHoveredRowId] = useState(null);
+  return /* @__PURE__ */ React__default.createElement(TooltipProvider, null, /* @__PURE__ */ React__default.createElement(Box, { css: { width: "100%", height: "100%", overflow: "scroll" } }, /* @__PURE__ */ React__default.createElement(
+    Grid,
+    {
+      templateColumns: SCHEDULED_TABLE_COLUMNS.map((col) => col.width).join(" "),
+      css: {
+        borderTop: "$borderWidths$xs solid $neutral200",
+        borderBottom: "$borderWidths$xs solid $neutral200",
+        padding: "$7 $12",
+        color: "$neutral900",
+        alignItems: "center",
+        position: "sticky",
+        top: "0",
+        background: "white",
+        zIndex: "2"
+      }
+    },
+    SCHEDULED_TABLE_COLUMNS.map((column) => /* @__PURE__ */ React__default.createElement(Text, { key: column.key, weight: "medium" }, column.label))
+  ), scheduled.map((item) => /* @__PURE__ */ React__default.createElement(
+    Grid,
+    {
+      key: item.id,
+      onMouseEnter: () => setHoveredRowId(item.id),
+      onMouseLeave: () => setHoveredRowId(null),
+      templateColumns: SCHEDULED_TABLE_COLUMNS.map((col) => col.width).join(" "),
+      css: {
+        borderBottom: "$borderWidths$xs solid $neutral100",
+        padding: "$9 $12",
+        fontWeight: "$4",
+        color: "$neutral700",
+        alignItems: "center"
+      }
+    },
+    /* @__PURE__ */ React__default.createElement(Text, null, /* @__PURE__ */ React__default.createElement(Switch, { checked: item.scheduled, size: "sm" })),
+    /* @__PURE__ */ React__default.createElement(Text, { weight: "bold", css: { color: "$neutral900" } }, item.name),
+    /* @__PURE__ */ React__default.createElement(Text, { css: { color: "$neutral900" } }, item.type),
+    /* @__PURE__ */ React__default.createElement(Text, null, item.createdOn ? moment(item.createdOn).format(DATE_FORMAT.DISPLAY) : "-"),
+    /* @__PURE__ */ React__default.createElement(Text, null, item.upcommingImport ? moment(item.upcommingImport).format(DATE_FORMAT.DISPLAY) : "-"),
+    /* @__PURE__ */ React__default.createElement(Text, null, item.status === "success" ? /* @__PURE__ */ React__default.createElement(TickCircleFillIcon, { color: "#5EA130", size: 24 }) : /* @__PURE__ */ React__default.createElement(AlertFillIcon, { color: "#F65633", size: 24 })),
+    /* @__PURE__ */ React__default.createElement(Flex, { justifyContent: "center" }, hoveredRowId === item.id && /* @__PURE__ */ React__default.createElement(DropdownMenu, { size: "sm" }, /* @__PURE__ */ React__default.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(IconButton, { size: "md", variant: "ghost", color: "secondary", icon: /* @__PURE__ */ React__default.createElement(EllipsisVerticalIcon, null) })), /* @__PURE__ */ React__default.createElement(DropdownMenuContent, { onCloseAutoFocus: (e) => e.preventDefault(), side: "bottom", align: "end", css: { minWidth: "128px", padding: "$4 0" } }, /* @__PURE__ */ React__default.createElement(DropdownMenuItem, { css: { cursor: "pointer" } }, /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React__default.createElement(PencilIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, LABELS.EDIT))), /* @__PURE__ */ React__default.createElement(DropdownMenuItem, { css: { cursor: "pointer" } }, /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React__default.createElement(DeleteIcon, { color: "#6A6A6A", size: 20 }), /* @__PURE__ */ React__default.createElement(Text, { size: "sm" }, LABELS.DELETE))))))
+  ))));
+};
+
+export { Scheduled as default };
+//# sourceMappingURL=Scheduled.js.map

package/dist/es/contact-import/components/ManageImport/Scheduled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Scheduled.js","sources":["../../../../../src/contact-import/components/ManageImport/Scheduled.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n  Box,\n  Grid,\n  Switch,\n  Text,\n  TooltipProvider,\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n  IconButton,\n  Flex,\n} from '@sparrowengg/twigs-react';\nimport moment from 'moment';\nimport {\n  AlertFillIcon,\n  DeleteIcon,\n  PencilIcon,\n  EllipsisVerticalIcon,\n  TickCircleFillIcon,\n} from '@sparrowengg/twigs-react-icons';\nimport { ScheduledImportsProps } from '../../types';\nimport { SCHEDULED_TABLE_COLUMNS, DATE_FORMAT, LABELS } from '../../constants';\n\nconst Scheduled: React.FC<ScheduledImportsProps> = ({ scheduled }) => {\n  const [hoveredRowId, setHoveredRowId] = useState<string | null>(null);\n\n  return (\n    <TooltipProvider>\n      <Box css={{ width: '100%', height: '100%', overflow: 'scroll' }}>\n        <Grid\n          templateColumns={SCHEDULED_TABLE_COLUMNS.map((col) => col.width).join(' ')}\n          css={{\n            borderTop: '$borderWidths$xs solid $neutral200',\n            borderBottom: '$borderWidths$xs solid $neutral200',\n            padding: '$7 $12',\n            color: '$neutral900',\n            alignItems: 'center',\n            position: 'sticky',\n            top: '0',\n            background: 'white',\n            zIndex: '2',\n          }}\n        >\n          {SCHEDULED_TABLE_COLUMNS.map((column) => (\n            <Text key={column.key} weight=\"medium\">{column.label}</Text>\n          ))}\n        </Grid>\n        {scheduled.map((item) => (\n          <Grid\n            key={item.id}\n            onMouseEnter={() => setHoveredRowId(item.id)}\n            onMouseLeave={() => setHoveredRowId(null)}\n            templateColumns={SCHEDULED_TABLE_COLUMNS.map((col) => col.width).join(' ')}\n            css={{\n              borderBottom: '$borderWidths$xs solid $neutral100',\n              padding: '$9 $12',\n              fontWeight: '$4',\n              color: '$neutral700',\n              alignItems: 'center',\n            }}\n          >\n            <Text><Switch checked={item.scheduled} size=\"sm\" /></Text>\n            <Text weight=\"bold\" css={{ color: '$neutral900' }}>{item.name}</Text>\n            <Text css={{ color: '$neutral900' }}>{item.type}</Text>\n            <Text>{item.createdOn ? moment(item.createdOn).format(DATE_FORMAT.DISPLAY) : '-'}</Text>\n            <Text>{item.upcommingImport ? moment(item.upcommingImport).format(DATE_FORMAT.DISPLAY) : '-'}</Text>\n            <Text>\n              {item.status === 'success' ? (\n                <TickCircleFillIcon color=\"#5EA130\" size={24} />\n              ) : (\n                <AlertFillIcon color=\"#F65633\" size={24} />\n              )}\n            </Text>\n            <Flex justifyContent=\"center\">\n              {hoveredRowId === item.id && (\n                <DropdownMenu size=\"sm\">\n                  <DropdownMenuTrigger asChild>\n                    <IconButton size=\"md\" variant=\"ghost\" color=\"secondary\" icon={<EllipsisVerticalIcon />} />\n                  </DropdownMenuTrigger>\n                  <DropdownMenuContent onCloseAutoFocus={(e) => e.preventDefault()} side=\"bottom\" align=\"end\" css={{ minWidth: '128px', padding: '$4 0' }}>\n                    <DropdownMenuItem css={{ cursor: 'pointer' }}>\n                      <Flex alignItems=\"center\" gap=\"$2\">\n                        <PencilIcon color=\"#6A6A6A\" size={20} />\n                        <Text size=\"sm\">{LABELS.EDIT}</Text>\n                      </Flex>\n                    </DropdownMenuItem>\n                    <DropdownMenuItem css={{ cursor: 'pointer' }}>\n                      <Flex alignItems=\"center\" gap=\"$2\">\n                        <DeleteIcon color=\"#6A6A6A\" size={20} />\n                        <Text size=\"sm\">{LABELS.DELETE}</Text>\n                      </Flex>\n                    </DropdownMenuItem>\n                  </DropdownMenuContent>\n                </DropdownMenu>\n              )}\n            </Flex>\n          </Grid>\n        ))}\n      </Box>\n    </TooltipProvider>\n  );\n};\n\nexport default Scheduled;\n"],"names":["React"],"mappings":"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"}

package/dist/es/contact-import/components/Scheduling.js

@@ -0,0 +1,158 @@
+import React__default, { useState, useEffect, useCallback } from 'react';
+import dayjs from '../../node_modules/dayjs/dayjs.min.js';
+import utc from '../../node_modules/dayjs/plugin/utc.js';
+import timezone from '../../node_modules/dayjs/plugin/timezone.js';
+import { listTimeZones } from '../../node_modules/timezone-support/dist/index.js';
+import TimePicker from './TimePicker.js';
+import { DEFAULT_SCHEDULE_TIME, SCHEDULE_PERIODS } from '../constants/index.js';
+import { Flex } from '../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../node_modules/@sparrowengg/twigs-react/dist/es/dropdown/dropdown.js';
+import { Button } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js';
+import { ChevronDownIcon } from '../../node_modules/@sparrowengg/twigs-react-icons/dist/es/icons/chevron-down.js';
+import { Text } from '../../node_modules/@sparrowengg/twigs-react/dist/es/text/text.js';
+import { Box } from '../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.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));
+dayjs.extend(utc);
+dayjs.extend(timezone);
+const getAllTimezones = () => {
+  return listTimeZones().map((tz) => {
+    const offset = dayjs().tz(tz).format("Z");
+    return `${tz} (GMT${offset})`;
+  });
+};
+const Scheduling = ({
+  globalStorage,
+  setGlobalStorage
+}) => {
+  const timeZones = getAllTimezones();
+  const [openTimePicker, setOpenTimePicker] = useState(false);
+  const [scheduleTime, setScheduleTime] = useState(
+    globalStorage.scheduleData || DEFAULT_SCHEDULE_TIME
+  );
+  useEffect(() => {
+    setGlobalStorage((prev) => __spreadProps(__spreadValues({}, prev), {
+      scheduleData: scheduleTime
+    }));
+  }, [scheduleTime, setGlobalStorage]);
+  useEffect(() => {
+    if (globalStorage.scheduleData) {
+      setScheduleTime(globalStorage.scheduleData);
+    }
+  }, [globalStorage.scheduleData]);
+  const handlePeriodChange = useCallback((period) => {
+    setScheduleTime((prev) => __spreadProps(__spreadValues({}, prev), { period }));
+  }, []);
+  const handleTimeZoneChange = useCallback((timeZone) => {
+    setScheduleTime((prev) => __spreadProps(__spreadValues({}, prev), { timeZone }));
+  }, []);
+  const closeTimePicker = useCallback(() => {
+    setOpenTimePicker(false);
+  }, []);
+  const toggleTimePicker = useCallback(() => {
+    setOpenTimePicker((prev) => !prev);
+  }, []);
+  return /* @__PURE__ */ React__default.createElement(Flex, { alignItems: "center", gap: "$2" }, /* @__PURE__ */ React__default.createElement(DropdownMenu, { modal: false }, /* @__PURE__ */ React__default.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(
+    Button,
+    {
+      rightIcon: /* @__PURE__ */ React__default.createElement(ChevronDownIcon, null),
+      variant: "ghost",
+      size: "lg",
+      "aria-label": LABELS.SELECT_SCHEDULE_PERIOD,
+      css: {
+        padding: "$1 $2",
+        borderRadius: "$md",
+        svg: { path: { strokeWidth: "2" } }
+      },
+      onClick: closeTimePicker
+    },
+    scheduleTime.period
+  )), /* @__PURE__ */ React__default.createElement(DropdownMenuContent, { align: "start", css: { minWidth: "168px" } }, SCHEDULE_PERIODS.map((option) => /* @__PURE__ */ React__default.createElement(
+    DropdownMenuItem,
+    {
+      key: option.id,
+      css: {
+        cursor: "pointer",
+        background: scheduleTime.period === option.label ? "#4A9CA60F" : "none"
+      },
+      onClick: () => handlePeriodChange(option.label)
+    },
+    option.label
+  )))), /* @__PURE__ */ React__default.createElement(Text, { css: { color: "$neutral600" }, size: "md" }, LABELS.AT), /* @__PURE__ */ React__default.createElement(Box, { css: { position: "relative" } }, /* @__PURE__ */ React__default.createElement(
+    Button,
+    {
+      rightIcon: /* @__PURE__ */ React__default.createElement(ChevronDownIcon, null),
+      variant: "ghost",
+      size: "lg",
+      onClick: toggleTimePicker,
+      css: {
+        padding: "$1 $2",
+        borderRadius: "$md",
+        svg: { path: { strokeWidth: "2" } }
+      }
+    },
+    `${scheduleTime.time.hours}:${scheduleTime.time.mins} ${scheduleTime.time.noon}`
+  ), openTimePicker && /* @__PURE__ */ React__default.createElement(
+    TimePicker,
+    {
+      openTimePicker,
+      setOpenTimePicker,
+      scheduleTime,
+      setScheduleTime
+    }
+  )), /* @__PURE__ */ React__default.createElement(DropdownMenu, { modal: false }, /* @__PURE__ */ React__default.createElement(DropdownMenuTrigger, { asChild: true }, /* @__PURE__ */ React__default.createElement(
+    Button,
+    {
+      rightIcon: /* @__PURE__ */ React__default.createElement(ChevronDownIcon, null),
+      variant: "ghost",
+      size: "lg",
+      "aria-label": LABELS.SELECT_TIME_ZONE,
+      css: {
+        padding: "$1 $2",
+        borderRadius: "$md",
+        svg: { path: { strokeWidth: "2" } }
+      },
+      onClick: closeTimePicker
+    },
+    scheduleTime.timeZone
+  )), /* @__PURE__ */ React__default.createElement(
+    DropdownMenuContent,
+    {
+      align: "start",
+      css: { maxHeight: "180px", overflow: "scroll" }
+    },
+    timeZones.map((tz) => /* @__PURE__ */ React__default.createElement(
+      DropdownMenuItem,
+      {
+        key: tz,
+        css: {
+          cursor: "pointer",
+          background: scheduleTime.timeZone === tz ? "#4A9CA60F" : "none"
+        },
+        onClick: () => handleTimeZoneChange(tz)
+      },
+      tz
+    ))
+  )));
+};
+
+export { Scheduling as default };
+//# sourceMappingURL=Scheduling.js.map

package/dist/es/contact-import/components/Scheduling.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Scheduling.js","sources":["../../../../src/contact-import/components/Scheduling.tsx"],"sourcesContent":["import React, { useEffect, useState, useCallback } from 'react';\nimport {\n  Box,\n  Flex,\n  Button,\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n  Text,\n} from '@sparrowengg/twigs-react';\nimport { ChevronDownIcon } from '@sparrowengg/twigs-react-icons';\nimport dayjs from 'dayjs';\nimport utc from 'dayjs/plugin/utc';\nimport timezone from 'dayjs/plugin/timezone';\nimport { listTimeZones } from 'timezone-support';\nimport TimePicker from './TimePicker';\nimport { SchedulingProps, ScheduleTime } from '../types';\nimport { SCHEDULE_PERIODS, DEFAULT_SCHEDULE_TIME } from '../constants';\n\n// Initialize dayjs plugins\ndayjs.extend(utc);\ndayjs.extend(timezone);\n\n/**\n * Gets all available timezones with GMT offset\n */\nconst getAllTimezones = (): string[] => {\n  return listTimeZones().map((tz) => {\n    const offset = dayjs().tz(tz).format('Z');\n    return `${tz} (GMT${offset})`;\n  });\n};\n\n/**\n * Component for scheduling recurring imports\n * Manages period, time, and timezone selection\n */\nconst Scheduling: React.FC<SchedulingProps> = ({\n  globalStorage,\n  setGlobalStorage,\n}) => {\n  const timeZones = getAllTimezones();\n  const [openTimePicker, setOpenTimePicker] = useState<boolean>(false);\n  const [scheduleTime, setScheduleTime] = useState<ScheduleTime>(\n    (globalStorage.scheduleData as ScheduleTime) || DEFAULT_SCHEDULE_TIME\n  );\n\n  // Sync schedule time with global storage\n  useEffect(() => {\n    setGlobalStorage((prev) => ({\n      ...prev,\n      scheduleData: scheduleTime,\n    }));\n  }, [scheduleTime, setGlobalStorage]);\n\n  // Load schedule data from global storage\n  useEffect(() => {\n    if (globalStorage.scheduleData) {\n      setScheduleTime(globalStorage.scheduleData as ScheduleTime);\n    }\n  }, [globalStorage.scheduleData]);\n\n  const handlePeriodChange = useCallback((period: string) => {\n    setScheduleTime((prev) => ({ ...prev, period }));\n  }, []);\n\n  const handleTimeZoneChange = useCallback((timeZone: string) => {\n    setScheduleTime((prev) => ({ ...prev, timeZone }));\n  }, []);\n\n  const closeTimePicker = useCallback(() => {\n    setOpenTimePicker(false);\n  }, []);\n\n  const toggleTimePicker = useCallback(() => {\n    setOpenTimePicker((prev) => !prev);\n  }, []);\n\n  return (\n    <Flex alignItems=\"center\" gap=\"$2\">\n      <DropdownMenu modal={false}>\n        <DropdownMenuTrigger asChild>\n          <Button\n            rightIcon={<ChevronDownIcon />}\n            variant=\"ghost\"\n            size=\"lg\"\n            aria-label={LABELS.SELECT_SCHEDULE_PERIOD}\n            css={{\n              padding: '$1 $2',\n              borderRadius: '$md',\n              svg: { path: { strokeWidth: '2' } },\n            }}\n            onClick={closeTimePicker}\n          >\n            {scheduleTime.period}\n          </Button>\n        </DropdownMenuTrigger>\n        <DropdownMenuContent align=\"start\" css={{ minWidth: '168px' }}>\n          {SCHEDULE_PERIODS.map((option) => (\n            <DropdownMenuItem\n              key={option.id}\n              css={{\n                cursor: 'pointer',\n                background:\n                  scheduleTime.period === option.label ? '#4A9CA60F' : 'none',\n              }}\n              onClick={() => handlePeriodChange(option.label)}\n            >\n              {option.label}\n            </DropdownMenuItem>\n          ))}\n        </DropdownMenuContent>\n      </DropdownMenu>\n      <Text css={{ color: '$neutral600' }} size=\"md\">\n        {LABELS.AT}\n      </Text>\n      <Box css={{ position: 'relative' }}>\n        <Button\n          rightIcon={<ChevronDownIcon />}\n          variant=\"ghost\"\n          size=\"lg\"\n          onClick={toggleTimePicker}\n          css={{\n            padding: '$1 $2',\n            borderRadius: '$md',\n            svg: { path: { strokeWidth: '2' } },\n          }}\n        >\n          {`${scheduleTime.time.hours}:${scheduleTime.time.mins} ${scheduleTime.time.noon}`}\n        </Button>\n        {openTimePicker && (\n          <TimePicker\n            openTimePicker={openTimePicker}\n            setOpenTimePicker={setOpenTimePicker}\n            scheduleTime={scheduleTime}\n            setScheduleTime={setScheduleTime}\n          />\n        )}\n      </Box>\n\n      <DropdownMenu modal={false}>\n        <DropdownMenuTrigger asChild>\n          <Button\n            rightIcon={<ChevronDownIcon />}\n            variant=\"ghost\"\n            size=\"lg\"\n            aria-label={LABELS.SELECT_TIME_ZONE}\n            css={{\n              padding: '$1 $2',\n              borderRadius: '$md',\n              svg: { path: { strokeWidth: '2' } },\n            }}\n            onClick={closeTimePicker}\n          >\n            {scheduleTime.timeZone}\n          </Button>\n        </DropdownMenuTrigger>\n        <DropdownMenuContent\n          align=\"start\"\n          css={{ maxHeight: '180px', overflow: 'scroll' }}\n        >\n          {timeZones.map((tz) => (\n            <DropdownMenuItem\n              key={tz}\n              css={{\n                cursor: 'pointer',\n                background: scheduleTime.timeZone === tz ? '#4A9CA60F' : 'none',\n              }}\n              onClick={() => handleTimeZoneChange(tz)}\n            >\n              {tz}\n            </DropdownMenuItem>\n          ))}\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </Flex>\n  );\n};\n\nexport default Scheduling;\n"],"names":["React"],"mappings":"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"}