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

package/dist/es/commons/components/edit-confirmation.js

@@ -1,23 +1,43 @@
-import React__default, { useState } from 'react';
+import React__default, { useState, useCallback } from 'react';
+import { CONSOLE_MESSAGES, CSS_CLASS_NAMES, BORDER_RADIUS, COLORS, VARIANTS, SIZE_VALUES, BUTTON_TEXT, COMPONENT_DISPLAY_NAMES } from '../constants/strings.js';
 import { AlertDialog, AlertDialogContent, AlertDialogTitle, AlertDialogDescription, AlertDialogActions, AlertDialogCancel, AlertDialogAction } from '../../node_modules/@sparrowengg/twigs-react/dist/es/alert-dialog/alert-dialog.js';
 import { Button } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js';
 
 const EditConfirmation = ({
-  name,
+  title,
   description,
   onConfirm,
-  onCancel
+  onCancel,
+  confirmText = BUTTON_TEXT.CONFIRM,
+  cancelText = BUTTON_TEXT.CANCEL
 }) => {
-  const [isDeleteIconHover, setIsDeleteIconHover] = useState(false);
+  const [isConfirmHover, setIsConfirmHover] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
+  const handleMouseEnter = useCallback(() => {
+    setIsConfirmHover(true);
+  }, []);
+  const handleMouseLeave = useCallback(() => {
+    setIsConfirmHover(false);
+  }, []);
+  const handleConfirm = useCallback(async () => {
+    try {
+      setIsLoading(true);
+      await onConfirm();
+    } catch (error) {
+      console.error(CONSOLE_MESSAGES.ERROR_DURING_CONFIRMATION, error);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [onConfirm]);
+  const confirmButtonColor = isConfirmHover ? COLORS.SECONDARY : COLORS.DEFAULT;
   return /* @__PURE__ */ React__default.createElement(AlertDialog, { open: true }, /* @__PURE__ */ React__default.createElement(
     AlertDialogContent,
     {
       onOpenAutoFocus: (e) => e.preventDefault(),
-      className: "dm-sans",
+      className: CSS_CLASS_NAMES.DM_SANS,
       css: {
         button: {
-          borderRadius: "8px"
+          borderRadius: BORDER_RADIUS.EIGHT_PX
         }
       }
     },
@@ -31,7 +51,7 @@ const EditConfirmation = ({
           padding: "24px $12 8px $12 !important"
         }
       },
-      name
+      title
     ),
     /* @__PURE__ */ React__default.createElement(
       AlertDialogDescription,
@@ -49,24 +69,21 @@ const EditConfirmation = ({
       },
       description
     ),
-    /* @__PURE__ */ React__default.createElement(AlertDialogActions, { css: { gap: "$6" } }, /* @__PURE__ */ React__default.createElement(AlertDialogCancel, { asChild: true, onClick: onCancel }, /* @__PURE__ */ React__default.createElement(Button, { color: "default", variant: "solid", size: "lg" }, "Cancel")), /* @__PURE__ */ React__default.createElement(AlertDialogAction, { asChild: true }, /* @__PURE__ */ React__default.createElement(
+    /* @__PURE__ */ React__default.createElement(AlertDialogActions, { css: { gap: "$6" } }, /* @__PURE__ */ React__default.createElement(AlertDialogCancel, { asChild: true, onClick: onCancel }, /* @__PURE__ */ React__default.createElement(Button, { color: COLORS.DEFAULT, variant: VARIANTS.SOLID, size: SIZE_VALUES.LARGE, disabled: isLoading }, cancelText)), /* @__PURE__ */ React__default.createElement(AlertDialogAction, { asChild: true }, /* @__PURE__ */ React__default.createElement(
       Button,
       {
         loading: isLoading,
-        onMouseEnter: () => setIsDeleteIconHover(true),
-        onMouseLeave: () => setIsDeleteIconHover(false),
-        color: isDeleteIconHover ? "secondary" : "default",
-        size: "lg",
-        onClick: async () => {
-          setIsLoading(true);
-          await onConfirm();
-          setIsLoading(false);
-        }
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        color: confirmButtonColor,
+        size: SIZE_VALUES.LARGE,
+        onClick: handleConfirm
       },
-      "Confirm"
+      confirmText
     )))
   ));
 };
+EditConfirmation.displayName = COMPONENT_DISPLAY_NAMES.EDIT_CONFIRMATION;
 
 export { EditConfirmation as default };
 //# sourceMappingURL=edit-confirmation.js.map

package/dist/es/commons/components/edit-confirmation.js.map

@@ -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":["React"],"mappings":";;;;AAiBA,MAAM,mBAAqD,CAAC;AAAA,EAC1D,IAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AACF,CAAM,KAAA;AACJ,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAChE,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAChD,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,WAAY,EAAA,EAAA,IAAA,EAAM,IACjB,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,eAAiB,EAAA,CAAC,CAAM,KAAA,CAAA,CAAE,cAAe,EAAA;AAAA,MACzC,SAAU,EAAA,SAAA;AAAA,MACV,GAAK,EAAA;AAAA,QACH,MAAQ,EAAA;AAAA,UACN,YAAc,EAAA,KAAA;AAAA,SAChB;AAAA,OACF;AAAA,KAAA;AAAA,oBAEAA,cAAA,CAAA,aAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,GAAK,EAAA;AAAA,UACH,OAAS,EAAA,MAAA;AAAA,UACT,cAAgB,EAAA,eAAA;AAAA,UAChB,MAAQ,EAAA,iBAAA;AAAA,UACR,OAAS,EAAA,6BAAA;AAAA,SACX;AAAA,OAAA;AAAA,MAEC,IAAA;AAAA,KACH;AAAA,oBAEAA,cAAA,CAAA,aAAA;AAAA,MAAC,sBAAA;AAAA,MAAA;AAAA,QACC,GAAK,EAAA;AAAA,UACH,YAAc,EAAA,YAAA;AAAA,UACd,OAAS,EAAA,4BAAA;AAAA,UACT,QAAU,EAAA,KAAA;AAAA,UACV,UAAY,EAAA,KAAA;AAAA,UACZ,UAAY,EAAA,MAAA;AAAA,UACZ,aAAe,EAAA,KAAA;AAAA,UACf,KAAO,EAAA,aAAA;AAAA,UACP,MAAQ,EAAA,cAAA;AAAA,SACV;AAAA,OAAA;AAAA,MAEC,WAAA;AAAA,KACH;AAAA,oBAEAA,cAAA,CAAA,aAAA,CAAC,kBAAmB,EAAA,EAAA,GAAA,EAAK,EAAE,GAAA,EAAK,IAAK,EAAA,EAAA,kBAClCA,cAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,EAAkB,OAAO,EAAA,IAAA,EAAC,OAAS,EAAA,QAAA,EAAA,kBACjCA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAO,KAAM,EAAA,SAAA,EAAU,OAAQ,EAAA,OAAA,EAAQ,IAAK,EAAA,IAAA,EAAA,EAAK,QAElD,CACF,CAEA,kBAAAA,cAAA,CAAA,aAAA,CAAC,iBAAkB,EAAA,EAAA,OAAA,EAAO,IACxB,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAS,EAAA,SAAA;AAAA,QACT,YAAA,EAAc,MAAM,oBAAA,CAAqB,IAAI,CAAA;AAAA,QAC7C,YAAA,EAAc,MAAM,oBAAA,CAAqB,KAAK,CAAA;AAAA,QAC9C,KAAA,EAAO,oBAAoB,WAAc,GAAA,SAAA;AAAA,QACzC,IAAK,EAAA,IAAA;AAAA,QACL,SAAS,YAAY;AACnB,UAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AACjB,UAAA,MAAM,SAAU,EAAA,CAAA;AAChB,UAAA,YAAA,CAAa,KAAK,CAAA,CAAA;AAAA,SACpB;AAAA,OAAA;AAAA,MACD,SAAA;AAAA,KAGH,CACF,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"edit-confirmation.js","sources":["../../../../src/commons/components/edit-confirmation.tsx"],"sourcesContent":["import React, { useState, useCallback } from 'react';\nimport {\n  AlertDialog,\n  AlertDialogContent,\n  AlertDialogTitle,\n  AlertDialogDescription,\n  AlertDialogActions,\n  AlertDialogCancel,\n  AlertDialogAction,\n  Button,\n} from '@sparrowengg/twigs-react';\nimport {\n  BUTTON_TEXT,\n  CSS_CLASS_NAMES,\n  COLORS,\n  SIZE_VALUES,\n  BORDER_RADIUS,\n  VARIANTS,\n  CONSOLE_MESSAGES,\n  COMPONENT_DISPLAY_NAMES,\n} from '../constants/strings';\n\n/**\n * Props for the EditConfirmation component\n */\nexport interface EditConfirmationProps {\n  /** Title text displayed at the top of the modal */\n  title: string;\n  /** Descriptive text explaining the edit action */\n  description: string;\n  /** Async callback function invoked when the user confirms the edit */\n  onConfirm: () => void | Promise<void>;\n  /** Callback function invoked when the user cancels the edit */\n  onCancel: () => void;\n  /** Optional: Text for the confirm button (defaults to \"Confirm\") */\n  confirmText?: string;\n  /** Optional: Text for the cancel button (defaults to \"Cancel\") */\n  cancelText?: string;\n}\n\n/**\n * EditConfirmation Component\n * \n * A confirmation dialog specifically designed for edit operations.\n * Supports async operations with loading state and hover effects.\n * \n * @example\n * ```tsx\n * <EditConfirmation\n *   title=\"Confirm Edit\"\n *   description=\"Are you sure you want to save these changes?\"\n *   onConfirm={async () => await saveChanges()}\n *   onCancel={handleCancel}\n * />\n * ```\n */\nconst EditConfirmation: React.FC<EditConfirmationProps> = ({\n  title,\n  description,\n  onConfirm,\n  onCancel,\n  confirmText = BUTTON_TEXT.CONFIRM,\n  cancelText = BUTTON_TEXT.CANCEL,\n}) => {\n  const [isConfirmHover, setIsConfirmHover] = useState(false);\n  const [isLoading, setIsLoading] = useState(false);\n\n  const handleMouseEnter = useCallback(() => {\n    setIsConfirmHover(true);\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    setIsConfirmHover(false);\n  }, []);\n\n  const handleConfirm = useCallback(async () => {\n    try {\n      setIsLoading(true);\n      await onConfirm();\n    } catch (error) {\n      console.error(CONSOLE_MESSAGES.ERROR_DURING_CONFIRMATION, error);\n    } finally {\n      setIsLoading(false);\n    }\n  }, [onConfirm]);\n\n  const confirmButtonColor = isConfirmHover ? COLORS.SECONDARY : COLORS.DEFAULT;\n\n  return (\n    <AlertDialog open={true}>\n      <AlertDialogContent\n        onOpenAutoFocus={(e) => e.preventDefault()}\n        className={CSS_CLASS_NAMES.DM_SANS}\n        css={{\n          button: {\n            borderRadius: BORDER_RADIUS.EIGHT_PX,\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          {title}\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={COLORS.DEFAULT} variant={VARIANTS.SOLID} size={SIZE_VALUES.LARGE} disabled={isLoading}>\n              {cancelText}\n            </Button>\n          </AlertDialogCancel>\n\n          <AlertDialogAction asChild>\n            <Button\n              loading={isLoading}\n              onMouseEnter={handleMouseEnter}\n              onMouseLeave={handleMouseLeave}\n              color={confirmButtonColor}\n              size={SIZE_VALUES.LARGE}\n              onClick={handleConfirm}\n            >\n              {confirmText}\n            </Button>\n          </AlertDialogAction>\n        </AlertDialogActions>\n      </AlertDialogContent>\n    </AlertDialog>\n  );\n};\n\nEditConfirmation.displayName = COMPONENT_DISPLAY_NAMES.EDIT_CONFIRMATION;\n\nexport default EditConfirmation;\n"],"names":["React"],"mappings":"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"}

package/dist/es/commons/components/import-modal.js

@@ -1,4 +1,5 @@
-import React__default from 'react';
+import React__default, { useCallback } from 'react';
+import { VARIANTS, COLORS, SIZE_VALUES, ARIA_LABELS, COMPONENT_DISPLAY_NAMES, MODAL_TITLES, FORM_LABELS, BUTTON_TEXT } from '../constants/strings.js';
 import { Dialog, DialogContent } from '../../node_modules/@sparrowengg/twigs-react/dist/es/dialog/dialog.js';
 import { Flex } from '../../node_modules/@sparrowengg/twigs-react/dist/es/flex/flex.js';
 import { Heading } from '../../node_modules/@sparrowengg/twigs-react/dist/es/heading/heading.js';
@@ -8,11 +9,29 @@ import { Box } from '../../node_modules/@sparrowengg/twigs-react/dist/es/box/box
 import { FormInput } from '../../node_modules/@sparrowengg/twigs-react/dist/es/input/form-input.js';
 import { Button } from '../../node_modules/@sparrowengg/twigs-react/dist/es/button/button.js';
 
+const DEFAULT_CONFIG = {
+  title: MODAL_TITLES.NEW_CUSTOM_PROPERTY,
+  inputLabel: FORM_LABELS.PROPERTY_NAME,
+  saveButtonText: BUTTON_TEXT.SAVE,
+  cancelButtonText: BUTTON_TEXT.CANCEL,
+  iconColor: COLORS.ICON_GRAY_DARK
+};
 const ImportModal = ({
-  onCloseHandler,
-  onInputHandler,
-  onSaveHandler
+  onClose,
+  onInputChange,
+  onSave,
+  value = "",
+  title = DEFAULT_CONFIG.title,
+  inputLabel = DEFAULT_CONFIG.inputLabel,
+  placeholder,
+  isSaveDisabled = false
 }) => {
+  const handleInputChange = useCallback(
+    (event) => {
+      onInputChange(event.currentTarget.value);
+    },
+    [onInputChange]
+  );
   return /* @__PURE__ */ React__default.createElement(Dialog, { open: true }, /* @__PURE__ */ React__default.createElement(
     DialogContent,
     {
@@ -31,20 +50,21 @@ const ImportModal = ({
           borderBottom: "$borderWidths$xs solid $neutral200"
         }
       },
-      /* @__PURE__ */ React__default.createElement(Heading, { size: "h6", css: { color: "$neutral900" } }, "New Custom Property"),
+      /* @__PURE__ */ React__default.createElement(Heading, { size: "h6", css: { color: "$neutral900" } }, title),
       /* @__PURE__ */ React__default.createElement(
         IconButton,
         {
-          variant: "ghost",
-          color: "default",
+          variant: VARIANTS.GHOST,
+          color: COLORS.DEFAULT,
           icon: /* @__PURE__ */ React__default.createElement(CloseIcon, null),
-          size: "lg",
+          size: SIZE_VALUES.LARGE,
           css: {
             "& svg": {
-              color: "#64748B !important"
+              color: `${DEFAULT_CONFIG.iconColor} !important`
             }
           },
-          onClick: onCloseHandler
+          onClick: onClose,
+          "aria-label": ARIA_LABELS.CLOSE_MODAL
         }
       )
     ),
@@ -58,10 +78,12 @@ const ImportModal = ({
       /* @__PURE__ */ React__default.createElement(
         FormInput,
         {
-          label: "Property Name",
+          label: inputLabel,
+          value,
           requiredIndicator: true,
-          onChange: (event) => onInputHandler(event.currentTarget.value),
-          size: "lg"
+          onChange: handleInputChange,
+          size: SIZE_VALUES.LARGE,
+          placeholder
         }
       )
     ),
@@ -77,17 +99,26 @@ const ImportModal = ({
       /* @__PURE__ */ React__default.createElement(
         Button,
         {
-          size: "lg",
-          variant: "ghost",
-          color: "default",
-          onClick: onCloseHandler
+          size: SIZE_VALUES.LARGE,
+          variant: VARIANTS.GHOST,
+          color: COLORS.DEFAULT,
+          onClick: onClose
         },
-        "Cancel"
+        DEFAULT_CONFIG.cancelButtonText
       ),
-      /* @__PURE__ */ React__default.createElement(Button, { size: "lg", onClick: onSaveHandler }, "Save")
+      /* @__PURE__ */ React__default.createElement(
+        Button,
+        {
+          size: SIZE_VALUES.LARGE,
+          onClick: onSave,
+          disabled: isSaveDisabled
+        },
+        DEFAULT_CONFIG.saveButtonText
+      )
     )
   ));
 };
+ImportModal.displayName = COMPONENT_DISPLAY_NAMES.IMPORT_MODAL;
 
 export { ImportModal as default };
 //# sourceMappingURL=import-modal.js.map

package/dist/es/commons/components/import-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"import-modal.js","sources":["../../../../src/commons/components/import-modal.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\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 from \"react\";\n\ntype ImportModalProps = {\n  onCloseHandler: () => void;\n  onInputHandler: (value: string) => void;\n  onSaveHandler: () => void;\n};\n\nconst ImportModal: React.FC<ImportModalProps> = ({\n  onCloseHandler,\n  onInputHandler,\n  onSaveHandler,\n}) => {\n  return (\n    <Dialog open>\n      <DialogContent\n        css={{\n          padding: 0,\n          borderRadius: \"$3xl\",\n        }}\n      >\n        <Flex\n          alignItems=\"center\"\n          justifyContent=\"space-between\"\n          css={{\n            padding: \"$8 $12\",\n            borderBottom: \"$borderWidths$xs solid $neutral200\",\n          }}\n        >\n          <Heading size=\"h6\" css={{ color: \"$neutral900\" }}>\n            New Custom Property\n          </Heading>\n          <IconButton\n            variant=\"ghost\"\n            color=\"default\"\n            icon={<CloseIcon />}\n            size=\"lg\"\n            css={{\n              \"& svg\": {\n                color: \"#64748B !important\",\n              },\n            }}\n            onClick={onCloseHandler}\n          />\n        </Flex>\n        <Box\n          css={{\n            padding: \"$12\",\n          }}\n        >\n          <FormInput\n            label={\"Property Name\"}\n            requiredIndicator\n            onChange={(event) => onInputHandler(event.currentTarget.value)}\n            size=\"lg\"\n          />\n        </Box>\n        <Flex\n          gap=\"$4\"\n          css={{\n            justifyContent: \"flex-end\",\n            padding: \"$8 $12\",\n          }}\n        >\n          <Button\n            size=\"lg\"\n            variant=\"ghost\"\n            color=\"default\"\n            onClick={onCloseHandler}\n          >\n            Cancel\n          </Button>\n          <Button size=\"lg\" onClick={onSaveHandler}>\n            Save\n          </Button>\n        </Flex>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\nexport default ImportModal;"],"names":["React"],"mappings":";;;;;;;;;;AAmBA,MAAM,cAA0C,CAAC;AAAA,EAC/C,cAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AACF,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,IAAA,EAAI,IACV,EAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,GAAK,EAAA;AAAA,QACH,OAAS,EAAA,CAAA;AAAA,QACT,YAAc,EAAA,MAAA;AAAA,OAChB;AAAA,KAAA;AAAA,oBAEAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,UAAW,EAAA,QAAA;AAAA,QACX,cAAe,EAAA,eAAA;AAAA,QACf,GAAK,EAAA;AAAA,UACH,OAAS,EAAA,QAAA;AAAA,UACT,YAAc,EAAA,oCAAA;AAAA,SAChB;AAAA,OAAA;AAAA,sBAEAA,cAAA,CAAA,aAAA,CAAC,WAAQ,IAAK,EAAA,IAAA,EAAK,KAAK,EAAE,KAAA,EAAO,aAAc,EAAA,EAAA,EAAG,qBAElD,CAAA;AAAA,sBACAA,cAAA,CAAA,aAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,OAAA;AAAA,UACR,KAAM,EAAA,SAAA;AAAA,UACN,IAAA,+CAAO,SAAU,EAAA,IAAA,CAAA;AAAA,UACjB,IAAK,EAAA,IAAA;AAAA,UACL,GAAK,EAAA;AAAA,YACH,OAAS,EAAA;AAAA,cACP,KAAO,EAAA,oBAAA;AAAA,aACT;AAAA,WACF;AAAA,UACA,OAAS,EAAA,cAAA;AAAA,SAAA;AAAA,OACX;AAAA,KACF;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,GAAK,EAAA;AAAA,UACH,OAAS,EAAA,KAAA;AAAA,SACX;AAAA,OAAA;AAAA,sBAEAA,cAAA,CAAA,aAAA;AAAA,QAAC,SAAA;AAAA,QAAA;AAAA,UACC,KAAO,EAAA,eAAA;AAAA,UACP,iBAAiB,EAAA,IAAA;AAAA,UACjB,UAAU,CAAC,KAAA,KAAU,cAAe,CAAA,KAAA,CAAM,cAAc,KAAK,CAAA;AAAA,UAC7D,IAAK,EAAA,IAAA;AAAA,SAAA;AAAA,OACP;AAAA,KACF;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,GAAI,EAAA,IAAA;AAAA,QACJ,GAAK,EAAA;AAAA,UACH,cAAgB,EAAA,UAAA;AAAA,UAChB,OAAS,EAAA,QAAA;AAAA,SACX;AAAA,OAAA;AAAA,sBAEAA,cAAA,CAAA,aAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,IAAK,EAAA,IAAA;AAAA,UACL,OAAQ,EAAA,OAAA;AAAA,UACR,KAAM,EAAA,SAAA;AAAA,UACN,OAAS,EAAA,cAAA;AAAA,SAAA;AAAA,QACV,QAAA;AAAA,OAED;AAAA,mDACC,MAAO,EAAA,EAAA,IAAA,EAAK,IAAK,EAAA,OAAA,EAAS,iBAAe,MAE1C,CAAA;AAAA,KACF;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"import-modal.js","sources":["../../../../src/commons/components/import-modal.tsx"],"sourcesContent":["import React, { useCallback, ChangeEvent } from 'react';\nimport {\n  Box,\n  Button,\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 {\n  MODAL_TITLES,\n  FORM_LABELS,\n  BUTTON_TEXT,\n  COLORS,\n  SIZE_VALUES,\n  VARIANTS,\n  ARIA_LABELS,\n  COMPONENT_DISPLAY_NAMES,\n} from '../constants/strings';\n\n/**\n * Props for the ImportModal component\n */\nexport interface ImportModalProps {\n  /** Callback invoked when the modal is closed */\n  onClose: () => void;\n  /** Callback invoked when the input value changes */\n  onInputChange: (value: string) => void;\n  /** Callback invoked when the save button is clicked */\n  onSave: () => void;\n  /** Optional: Current input value for controlled component */\n  value?: string;\n  /** Optional: Custom modal title (defaults to \"New Custom Property\") */\n  title?: string;\n  /** Optional: Custom input label (defaults to \"Property Name\") */\n  inputLabel?: string;\n  /** Optional: Custom input placeholder */\n  placeholder?: string;\n  /** Optional: Whether the save button is disabled */\n  isSaveDisabled?: boolean;\n}\n\n/**\n * Default configuration for the import modal\n */\nconst DEFAULT_CONFIG = {\n  title: MODAL_TITLES.NEW_CUSTOM_PROPERTY,\n  inputLabel: FORM_LABELS.PROPERTY_NAME,\n  saveButtonText: BUTTON_TEXT.SAVE,\n  cancelButtonText: BUTTON_TEXT.CANCEL,\n  iconColor: COLORS.ICON_GRAY_DARK,\n} as const;\n\n/**\n * ImportModal Component\n * \n * A modal dialog for creating a new custom property with form input.\n * Provides a clean interface for property name entry with validation support.\n * \n * @example\n * ```tsx\n * <ImportModal\n *   onClose={handleClose}\n *   onInputChange={handleInputChange}\n *   onSave={handleSave}\n *   value={propertyName}\n * />\n * ```\n */\nconst ImportModal: React.FC<ImportModalProps> = ({\n  onClose,\n  onInputChange,\n  onSave,\n  value = '',\n  title = DEFAULT_CONFIG.title,\n  inputLabel = DEFAULT_CONFIG.inputLabel,\n  placeholder,\n  isSaveDisabled = false,\n}) => {\n  const handleInputChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      onInputChange(event.currentTarget.value);\n    },\n    [onInputChange]\n  );\n\n  return (\n    <Dialog open>\n      <DialogContent\n        css={{\n          padding: 0,\n          borderRadius: '$3xl',\n        }}\n      >\n        <Flex\n          alignItems=\"center\"\n          justifyContent=\"space-between\"\n          css={{\n            padding: '$8 $12',\n            borderBottom: '$borderWidths$xs solid $neutral200',\n          }}\n        >\n          <Heading size=\"h6\" css={{ color: '$neutral900' }}>\n            {title}\n          </Heading>\n          <IconButton\n            variant={VARIANTS.GHOST}\n            color={COLORS.DEFAULT}\n            icon={<CloseIcon />}\n            size={SIZE_VALUES.LARGE}\n            css={{\n              '& svg': {\n                color: `${DEFAULT_CONFIG.iconColor} !important`,\n              },\n            }}\n            onClick={onClose}\n            aria-label={ARIA_LABELS.CLOSE_MODAL}\n          />\n        </Flex>\n\n        <Box\n          css={{\n            padding: '$12',\n          }}\n        >\n          <FormInput\n            label={inputLabel}\n            value={value}\n            requiredIndicator\n            onChange={handleInputChange}\n            size={SIZE_VALUES.LARGE}\n            placeholder={placeholder}\n          />\n        </Box>\n\n        <Flex\n          gap=\"$4\"\n          css={{\n            justifyContent: 'flex-end',\n            padding: '$8 $12',\n          }}\n        >\n          <Button\n            size={SIZE_VALUES.LARGE}\n            variant={VARIANTS.GHOST}\n            color={COLORS.DEFAULT}\n            onClick={onClose}\n          >\n            {DEFAULT_CONFIG.cancelButtonText}\n          </Button>\n          <Button\n            size={SIZE_VALUES.LARGE}\n            onClick={onSave}\n            disabled={isSaveDisabled}\n          >\n            {DEFAULT_CONFIG.saveButtonText}\n          </Button>\n        </Flex>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\nImportModal.displayName = COMPONENT_DISPLAY_NAMES.IMPORT_MODAL;\n\nexport default ImportModal;"],"names":["React"],"mappings":"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"}

package/dist/es/commons/components/spinner.js

@@ -1,4 +1,5 @@
 import React__default from 'react';
+import { ATTRIBUTES, SIZE_VALUES, ARIA_LABELS, COMPONENT_DISPLAY_NAMES } from '../constants/strings.js';
 import { keyframes, styled } from '../../node_modules/@sparrowengg/twigs-react/dist/es/stitches.config.js';
 import { Box } from '../../node_modules/@sparrowengg/twigs-react/dist/es/box/box.js';
 
@@ -37,9 +38,22 @@ const StyledBox = styled(Box, {
     size: "md"
   }
 });
-const Spinner = ({ size = "md" }) => {
-  return /* @__PURE__ */ React__default.createElement(StyledBox, { size });
+const Spinner = ({
+  size = SIZE_VALUES.MEDIUM,
+  className,
+  ariaLabel = ARIA_LABELS.LOADING
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    StyledBox,
+    {
+      size,
+      className,
+      role: ATTRIBUTES.STATUS,
+      "aria-label": ariaLabel
+    }
+  );
 };
+Spinner.displayName = COMPONENT_DISPLAY_NAMES.SPINNER;
 
 export { Spinner as default };
 //# sourceMappingURL=spinner.js.map

package/dist/es/commons/components/spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","sources":["../../../../src/commons/components/spinner.tsx"],"sourcesContent":["import React from \"react\";\nimport { keyframes, Box, styled } from \"@sparrowengg/twigs-react\";\n\nconst spin = keyframes({\n  \"0%\": { transform: \"rotate(0deg)\" },\n  \"100%\": { transform: \"rotate(360deg)\" },\n});\n\nconst StyledBox = styled(Box, {\n  borderRadius: \"50%\",\n  width: \"$7\",\n  height: \"$7\",\n  borderStyle: \"solid\",\n  borderWidth: \"$md\",\n  borderBottomColor: \"$neutral400\",\n  borderRightColor: \"$neutral400\",\n  borderTopColor: \"$black900\",\n  borderLeftColor: \"$black900\",\n  animationDuration: \"800ms\",\n  animationTimingFunction: \"linear\",\n  animationIterationCount: \"infinite\",\n  willChange: \"transform\",\n  animationName: `${spin}`,\n  variants: {\n    size: {\n      sm: {\n        width: \"$5\",\n        height: \"$5\",\n      },\n      md: {\n        width: \"$7\",\n        height: \"$7\",\n      },\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\ntype SpinnerProps = {\n  size?: \"md\" | \"sm\";\n};\n\nconst Spinner: React.FC<SpinnerProps> = ({ size = \"md\" }) => {\n  return <StyledBox size={size} />;\n};\n\nexport default Spinner;"],"names":["React"],"mappings":";;;;AAGA,MAAM,OAAO,SAAU,CAAA;AAAA,EACrB,IAAA,EAAM,EAAE,SAAA,EAAW,cAAe,EAAA;AAAA,EAClC,MAAA,EAAQ,EAAE,SAAA,EAAW,gBAAiB,EAAA;AACxC,CAAC,CAAA,CAAA;AAED,MAAM,SAAA,GAAY,OAAO,GAAK,EAAA;AAAA,EAC5B,YAAc,EAAA,KAAA;AAAA,EACd,KAAO,EAAA,IAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,WAAa,EAAA,OAAA;AAAA,EACb,WAAa,EAAA,KAAA;AAAA,EACb,iBAAmB,EAAA,aAAA;AAAA,EACnB,gBAAkB,EAAA,aAAA;AAAA,EAClB,cAAgB,EAAA,WAAA;AAAA,EAChB,eAAiB,EAAA,WAAA;AAAA,EACjB,iBAAmB,EAAA,OAAA;AAAA,EACnB,uBAAyB,EAAA,QAAA;AAAA,EACzB,uBAAyB,EAAA,UAAA;AAAA,EACzB,UAAY,EAAA,WAAA;AAAA,EACZ,aAAA,EAAe,GAAG,IAAI,CAAA,CAAA;AAAA,EACtB,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,EAAI,EAAA;AAAA,QACF,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,OACV;AAAA,MACA,EAAI,EAAA;AAAA,QACF,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,OACV;AAAA,KACF;AAAA,GACF;AAAA,EACA,eAAiB,EAAA;AAAA,IACf,IAAM,EAAA,IAAA;AAAA,GACR;AACF,CAAC,CAAA,CAAA;AAMD,MAAM,OAAkC,GAAA,CAAC,EAAE,IAAA,GAAO,MAAW,KAAA;AAC3D,EAAO,uBAAAA,cAAA,CAAA,aAAA,CAAC,aAAU,IAAY,EAAA,CAAA,CAAA;AAChC;;;;"}
+{"version":3,"file":"spinner.js","sources":["../../../../src/commons/components/spinner.tsx"],"sourcesContent":["import React from 'react';\nimport { keyframes, Box, styled } from '@sparrowengg/twigs-react';\nimport { SIZE_VALUES, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Available spinner sizes\n */\nexport type SpinnerSize = 'sm' | 'md';\n\n/**\n * Props for the Spinner component\n */\nexport interface SpinnerProps {\n  /** Size variant of the spinner */\n  size?: SpinnerSize;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Keyframe animation for spinner rotation\n */\nconst spin = keyframes({\n  '0%': { transform: 'rotate(0deg)' },\n  '100%': { transform: 'rotate(360deg)' },\n});\n\n/**\n * Styled spinner component with size variants\n */\nconst StyledBox = styled(Box, {\n  borderRadius: '50%',\n  width: '$7',\n  height: '$7',\n  borderStyle: 'solid',\n  borderWidth: '$md',\n  borderBottomColor: '$neutral400',\n  borderRightColor: '$neutral400',\n  borderTopColor: '$black900',\n  borderLeftColor: '$black900',\n  animationDuration: '800ms',\n  animationTimingFunction: 'linear',\n  animationIterationCount: 'infinite',\n  willChange: 'transform',\n  animationName: `${spin}`,\n  variants: {\n    size: {\n      sm: {\n        width: '$5',\n        height: '$5',\n      },\n      md: {\n        width: '$7',\n        height: '$7',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\n/**\n * Spinner Component\n * \n * A loading spinner with customizable size.\n * Provides visual feedback during async operations.\n * \n * @example\n * ```tsx\n * <Spinner size=\"md\" ariaLabel=\"Loading content\" />\n * ```\n */\nconst Spinner: React.FC<SpinnerProps> = ({\n  size = SIZE_VALUES.MEDIUM,\n  className,\n  ariaLabel = ARIA_LABELS.LOADING,\n}) => {\n  return (\n    <StyledBox\n      size={size}\n      className={className}\n      role={ATTRIBUTES.STATUS}\n      aria-label={ariaLabel}\n    />\n  );\n};\n\nSpinner.displayName = COMPONENT_DISPLAY_NAMES.SPINNER;\n\nexport default Spinner;"],"names":["React"],"mappings":";;;;;AAwBA,MAAM,OAAO,SAAU,CAAA;AAAA,EACrB,IAAA,EAAM,EAAE,SAAA,EAAW,cAAe,EAAA;AAAA,EAClC,MAAA,EAAQ,EAAE,SAAA,EAAW,gBAAiB,EAAA;AACxC,CAAC,CAAA,CAAA;AAKD,MAAM,SAAA,GAAY,OAAO,GAAK,EAAA;AAAA,EAC5B,YAAc,EAAA,KAAA;AAAA,EACd,KAAO,EAAA,IAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,WAAa,EAAA,OAAA;AAAA,EACb,WAAa,EAAA,KAAA;AAAA,EACb,iBAAmB,EAAA,aAAA;AAAA,EACnB,gBAAkB,EAAA,aAAA;AAAA,EAClB,cAAgB,EAAA,WAAA;AAAA,EAChB,eAAiB,EAAA,WAAA;AAAA,EACjB,iBAAmB,EAAA,OAAA;AAAA,EACnB,uBAAyB,EAAA,QAAA;AAAA,EACzB,uBAAyB,EAAA,UAAA;AAAA,EACzB,UAAY,EAAA,WAAA;AAAA,EACZ,aAAA,EAAe,GAAG,IAAI,CAAA,CAAA;AAAA,EACtB,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,EAAI,EAAA;AAAA,QACF,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,OACV;AAAA,MACA,EAAI,EAAA;AAAA,QACF,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,OACV;AAAA,KACF;AAAA,GACF;AAAA,EACA,eAAiB,EAAA;AAAA,IACf,IAAM,EAAA,IAAA;AAAA,GACR;AACF,CAAC,CAAA,CAAA;AAaD,MAAM,UAAkC,CAAC;AAAA,EACvC,OAAO,WAAY,CAAA,MAAA;AAAA,EACnB,SAAA;AAAA,EACA,YAAY,WAAY,CAAA,OAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAM,UAAW,CAAA,MAAA;AAAA,MACjB,YAAY,EAAA,SAAA;AAAA,KAAA;AAAA,GACd,CAAA;AAEJ,EAAA;AAEA,OAAA,CAAQ,cAAc,uBAAwB,CAAA,OAAA;;;;"}

package/dist/es/commons/components/theme-wrapper.js

@@ -1,20 +1,17 @@
 import React__default from 'react';
+import { COMPONENT_DISPLAY_NAMES, FONT_FAMILIES } from '../constants/strings.js';
 import { ThemeProvider } from '../../node_modules/@sparrowengg/twigs-react/dist/es/theme-provider/theme-provider.js';
 
+const THEME_CONFIG = {
+  fonts: {
+    body: FONT_FAMILIES.DM_SANS_ROBOTO_MONO_SANS_SERIF,
+    heading: FONT_FAMILIES.DM_SANS_ROBOTO_MONO_SANS_SERIF
+  }
+};
 const ThemeWrapper = ({ children }) => {
-  return /* @__PURE__ */ React__default.createElement(
-    ThemeProvider,
-    {
-      theme: {
-        fonts: {
-          body: "DM Sans, Roboto Mono, sans-serif",
-          heading: "DM Sans, Roboto Mono, sans-serif"
-        }
-      }
-    },
-    children
-  );
+  return /* @__PURE__ */ React__default.createElement(ThemeProvider, { theme: THEME_CONFIG }, children);
 };
+ThemeWrapper.displayName = COMPONENT_DISPLAY_NAMES.THEME_WRAPPER;
 
 export { ThemeWrapper as default };
 //# sourceMappingURL=theme-wrapper.js.map

package/dist/es/commons/components/theme-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-wrapper.js","sources":["../../../../src/commons/components/theme-wrapper.tsx"],"sourcesContent":["import { ThemeProvider, Flex } from \"@sparrowengg/twigs-react\";\nimport React, { ReactNode } from \"react\";\n\nconst ThemeWrapper = ({ children }: { children: ReactNode }) => {\n  return (\n    <ThemeProvider\n      theme={{\n        fonts: {\n          body: \"DM Sans, Roboto Mono, sans-serif\",\n          heading: \"DM Sans, Roboto Mono, sans-serif\"\n        }\n      }}\n    >\n      {children}\n    </ThemeProvider>\n  );\n};\n\nexport default ThemeWrapper;\n"],"names":["React"],"mappings":";;;AAGA,MAAM,YAAe,GAAA,CAAC,EAAE,QAAA,EAAwC,KAAA;AAC9D,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAO,EAAA;AAAA,UACL,IAAM,EAAA,kCAAA;AAAA,UACN,OAAS,EAAA,kCAAA;AAAA,SACX;AAAA,OACF;AAAA,KAAA;AAAA,IAEC,QAAA;AAAA,GACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"theme-wrapper.js","sources":["../../../../src/commons/components/theme-wrapper.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { ThemeProvider } from '@sparrowengg/twigs-react';\nimport { FONT_FAMILIES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the ThemeWrapper component\n */\nexport interface ThemeWrapperProps {\n  /** Child components to be wrapped with the theme provider */\n  children: ReactNode;\n}\n\n/**\n * Theme configuration for the application\n */\nconst THEME_CONFIG = {\n  fonts: {\n    body: FONT_FAMILIES.DM_SANS_ROBOTO_MONO_SANS_SERIF,\n    heading: FONT_FAMILIES.DM_SANS_ROBOTO_MONO_SANS_SERIF,\n  },\n} as const;\n\n/**\n * ThemeWrapper Component\n * \n * A wrapper component that provides consistent theme configuration\n * to all child components using the Twigs theme system.\n * \n * @example\n * ```tsx\n * <ThemeWrapper>\n *   <App />\n * </ThemeWrapper>\n * ```\n */\nconst ThemeWrapper: React.FC<ThemeWrapperProps> = ({ children }) => {\n  return <ThemeProvider theme={THEME_CONFIG}>{children}</ThemeProvider>;\n};\n\nThemeWrapper.displayName = COMPONENT_DISPLAY_NAMES.THEME_WRAPPER;\n\nexport default ThemeWrapper;\n"],"names":["React"],"mappings":";;;;AAeA,MAAM,YAAe,GAAA;AAAA,EACnB,KAAO,EAAA;AAAA,IACL,MAAM,aAAc,CAAA,8BAAA;AAAA,IACpB,SAAS,aAAc,CAAA,8BAAA;AAAA,GACzB;AACF,CAAA,CAAA;AAeA,MAAM,YAA4C,GAAA,CAAC,EAAE,QAAA,EAAe,KAAA;AAClE,EAAA,uBAAQA,cAAA,CAAA,aAAA,CAAA,aAAA,EAAA,EAAc,KAAO,EAAA,YAAA,EAAA,EAAe,QAAS,CAAA,CAAA;AACvD,EAAA;AAEA,YAAA,CAAa,cAAc,uBAAwB,CAAA,aAAA;;;;"}

package/dist/es/commons/constants/enhanced.js.map

@@ -1 +1 @@
-{"version":3,"file":"enhanced.js","sources":["../../../../src/commons/constants/enhanced.ts"],"sourcesContent":["import { SelectOption, DateOption, FilterCondition } from '../types/enhanced';\n\n// API Constants\nexport const API_ENDPOINTS = {\n  SURVEY_SPARROW: 'https://api.surveysparrow.com',\n  SURVEY_QUESTIONS: '/surveys/:surveyId/questions',\n  SURVEY_VARIABLES: '/surveys/:surveyId/variables',\n  SURVEY_EXPRESSIONS: '/surveys/:surveyId/expressions',\n  CONTACT_PROPERTIES: '/contact-properties',\n  SURVEY_CHANNELS: '/surveys/:surveyId/channels',\n} as const;\n\n// UI Constants\nexport const UI_CONSTANTS = {\n  FORM_WIDTH: 488,\n  MODAL_MAX_WIDTH: 600,\n  INPUT_MAX_LENGTH: 30,\n  TABLE_PAGE_SIZE: 10,\n  MAX_FILTER_CONDITIONS: 5,\n  DEBOUNCE_DELAY: 300,\n} as const;\n\n// CSS Spacing (Stitches Design Tokens)\nexport const SPACING = {\n  xs: '$2',\n  sm: '$4',\n  md: '$8',\n  lg: '$12',\n  xl: '$16',\n  '2xl': '$24',\n  '3xl': '$32',\n  '4xl': '$40',\n} as const;\n\n// Field Types\nexport const FIELD_TYPES = {\n  TEXT: 'text',\n  EMAIL: 'email',\n  PASSWORD: 'password',\n  NUMBER: 'number',\n  DATE: 'date',\n  SELECT: 'select',\n  CHECKBOX: 'checkbox',\n  RADIO: 'radio',\n  TEXTAREA: 'textarea',\n} as const;\n\n// Integration Field Types\nexport const INTEGRATION_FIELD_TYPES = {\n  STRING: 'STRING',\n  NUMBER: 'NUMBER',\n  BOOLEAN: 'BOOLEAN',\n  DATE_TIME: 'DATE_TIME',\n  EMAIL: 'EMAIL',\n  PHONE: 'PHONE',\n  URL: 'URL',\n} as const;\n\n// Survey Types\nexport const SURVEY_TYPES = {\n  CLASSIC: 'classic',\n  NPS: 'nps',\n  CHAT: 'chat',\n  KIOSK: 'kiosk',\n} as const;\n\n// Mapping Types\nexport const MAPPING_TYPES: SelectOption[] = [\n  { label: 'Question', value: 'QUESTION' },\n  { label: 'Contact', value: 'CONTACT' },\n  { label: 'Variable', value: 'VARIABLE' },\n  { label: 'Expression', value: 'EXPRESSION' },\n  { label: 'Submission Property', value: 'SUBMISSION_PROPERTY' },\n];\n\n// Data Type Options for Integration Fields\nexport const DATA_TYPE_OPTIONS: SelectOption[] = [\n  {\n    label: 'String',\n    value: 'STRING',\n  },\n  {\n    label: 'Number',\n    value: 'NUMBER',\n  },\n  {\n    label: 'Boolean',\n    value: 'BOOLEAN',\n  },\n  {\n    label: 'Date/Time',\n    value: 'DATE_TIME',\n  },\n];\n\n// Filter Operators\nexport const FILTER_OPERATORS: SelectOption[] = [\n  { label: 'is equals to', value: 'IS' },\n  { label: 'is not equals to', value: 'IS_NOT' },\n  { label: 'contains', value: 'CONTAINS' },\n  { label: 'not contains', value: 'CONTAINS_NOT' },\n  { label: 'has no value', value: 'NO_VALUE' },\n  { label: 'has any value', value: 'ANY_VALUE' },\n  { label: 'before', value: 'BEFORE' },\n  { label: 'after', value: 'AFTER' },\n  { label: 'on', value: 'ON' },\n];\n\n// Boolean Options\nexport const BOOLEAN_OPTIONS: SelectOption[] = [\n  { label: 'True', value: 'true' },\n  { label: 'False', value: 'false' },\n];\n\n// Date Options\nexport const DATE_OPTIONS: DateOption[] = [\n  {\n    label: 'Today',\n    value: 'today',\n    type: 'dynamic',\n  },\n  {\n    label: 'Yesterday',\n    value: 'yesterday',\n    type: 'dynamic',\n  },\n  {\n    label: 'Last 7 days',\n    value: 'last_7_days',\n    type: 'dynamic',\n  },\n  {\n    label: 'Last 30 days',\n    value: 'last_30_days',\n    type: 'dynamic',\n  },\n  {\n    label: 'Last 3 months',\n    value: 'last_3_months',\n    type: 'dynamic',\n  },\n  {\n    label: 'Custom Date',\n    value: 'custom',\n    type: 'static',\n  },\n];\n\n// Submission Properties for Classic Surveys\nexport const CLASSIC_SUBMISSION_PROPERTIES: SelectOption[] = [\n  { label: 'Submitted at', value: 'completed_time', type: 'STRING' },\n  { label: 'Device type', value: 'device_type', type: 'STRING' },\n  { label: 'Language', value: 'language', type: 'STRING' },\n  { label: 'Start time', value: 'start_time', type: 'STRING' },\n  { label: 'Survey ID', value: 'survey_id', type: 'STRING' },\n  { label: 'Time taken', value: 'time_taken', type: 'STRING' },\n  { label: 'Submission state', value: 'state', type: 'STRING' },\n  { label: 'Submission ID', value: 'id', type: 'STRING' },\n  { label: 'Location', value: 'location', type: 'STRING' },\n  { label: 'OS', value: 'os', type: 'STRING' },\n  { label: 'Browser', value: 'browser', type: 'STRING' },\n  { label: 'IP', value: 'ip', type: 'STRING' },\n  { label: 'Channel Type', value: 'channel_type', type: 'STRING' },\n];\n\n// Submission Properties for NPS Surveys\nexport const NPS_SUBMISSION_PROPERTIES: SelectOption[] = [\n  { label: 'Submission Start time', value: 'start_time', type: 'STRING' },\n  { label: 'Device type', value: 'device_type', type: 'STRING' },\n  { label: 'IP', value: 'ip', type: 'STRING' },\n  { label: 'Language', value: 'language', type: 'STRING' },\n  { label: 'Survey ID', value: 'survey_id', type: 'STRING' },\n  { label: 'Submission state', value: 'state', type: 'STRING' },\n  { label: 'Submission ID', value: 'id', type: 'STRING' },\n  { label: 'Time taken', value: 'time_taken', type: 'STRING' },\n  { label: 'Submitted at', value: 'completed_time', type: 'STRING' },\n  { label: 'Location', value: 'location', type: 'STRING' },\n  { label: 'OS', value: 'os', type: 'STRING' },\n  { label: 'Browser', value: 'browser', type: 'STRING' },\n];\n\n// Contact Import Frequencies\nexport const IMPORT_FREQUENCIES: SelectOption[] = [\n  { label: 'One Time', value: 'oneTime' },\n  { label: 'Daily', value: 'daily' },\n  { label: 'Weekly', value: 'weekly' },\n  { label: 'Monthly', value: 'monthly' },\n];\n\n// Time Zones (Common ones)\nexport const TIME_ZONES: SelectOption[] = [\n  { label: 'UTC', value: 'UTC' },\n  { label: 'America/New_York', value: 'America/New_York' },\n  { label: 'America/Los_Angeles', value: 'America/Los_Angeles' },\n  { label: 'Europe/London', value: 'Europe/London' },\n  { label: 'Asia/Kolkata', value: 'Asia/Kolkata' },\n  { label: 'Asia/Tokyo', value: 'Asia/Tokyo' },\n];\n\n// Notification Channels\nexport const NOTIFICATION_CHANNELS: SelectOption[] = [\n  { label: 'Email', value: 'email' },\n  { label: 'SMS', value: 'sms' },\n  { label: 'WhatsApp', value: 'whatsapp' },\n  { label: 'Slack', value: 'slack' },\n  { label: 'Webhook', value: 'webhook' },\n];\n\n// Status Options\nexport const STATUS_OPTIONS = {\n  PENDING: 'pending',\n  IN_PROGRESS: 'in_progress',\n  COMPLETED: 'completed',\n  FAILED: 'failed',\n  CANCELLED: 'cancelled',\n} as const;\n\n// Error Messages\nexport const ERROR_MESSAGES = {\n  REQUIRED_FIELD: 'This field is required',\n  INVALID_EMAIL: 'Please enter a valid email address',\n  INVALID_PHONE: 'Please enter a valid phone number',\n  INVALID_URL: 'Please enter a valid URL',\n  MIN_LENGTH: (min: number) => `Minimum ${min} characters required`,\n  MAX_LENGTH: (max: number) => `Maximum ${max} characters allowed`,\n  NETWORK_ERROR: 'Network error. Please try again.',\n  GENERIC_ERROR: 'Something went wrong. Please try again.',\n} as const;\n\n// Success Messages\nexport const SUCCESS_MESSAGES = {\n  SAVED: 'Saved successfully',\n  UPDATED: 'Updated successfully',\n  DELETED: 'Deleted successfully',\n  IMPORTED: 'Import completed successfully',\n  EXPORTED: 'Export completed successfully',\n} as const;\n\n// Loading Messages\nexport const LOADING_MESSAGES = {\n  SAVING: 'Saving...',\n  LOADING: 'Loading...',\n  PROCESSING: 'Processing...',\n  IMPORTING: 'Importing...',\n  EXPORTING: 'Exporting...',\n} as const;\n\n// Default Values\nexport const DEFAULT_VALUES = {\n  PAGE_SIZE: 10,\n  DEBOUNCE_DELAY: 300,\n  TOAST_DURATION: 3000,\n  MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n  SUPPORTED_FILE_TYPES: ['.csv', '.xlsx', '.json'],\n} as const;\n\n// Validation Rules\nexport const VALIDATION_RULES = {\n  EMAIL_REGEX: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n  PHONE_REGEX: /^\\+?[\\d\\s\\-\\(\\)]+$/,\n  URL_REGEX: /^https?:\\/\\/.+/,\n  MIN_PASSWORD_LENGTH: 8,\n  MAX_TEXT_LENGTH: 255,\n  MAX_TEXTAREA_LENGTH: 1000,\n} as const;\n"],"names":[],"mappings":"AAmEO,MAAM,aAAgC,GAAA;AAAA,EAC3C,EAAE,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,UAAW,EAAA;AAAA,EACvC,EAAE,KAAA,EAAO,SAAW,EAAA,KAAA,EAAO,SAAU,EAAA;AAAA,EACrC,EAAE,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,UAAW,EAAA;AAAA,EACvC,EAAE,KAAA,EAAO,YAAc,EAAA,KAAA,EAAO,YAAa,EAAA;AAAA,EAC3C,EAAE,KAAA,EAAO,qBAAuB,EAAA,KAAA,EAAO,qBAAsB,EAAA;AAC/D;;;;"}
+{"version":3,"file":"enhanced.js","sources":["../../../../src/commons/constants/enhanced.ts"],"sourcesContent":["import { SelectOption, DateOption, FilterCondition } from '../types/enhanced';\n\n// API Constants\nexport const API_ENDPOINTS = {\n  SURVEY_SPARROW: 'https://api.surveysparrow.com',\n  SURVEY_QUESTIONS: '/surveys/:surveyId/questions',\n  SURVEY_VARIABLES: '/surveys/:surveyId/variables',\n  SURVEY_EXPRESSIONS: '/surveys/:surveyId/expressions',\n  CONTACT_PROPERTIES: '/contact-properties',\n  SURVEY_CHANNELS: '/surveys/:surveyId/channels',\n} as const;\n\n// UI Constants\nexport const UI_CONSTANTS = {\n  FORM_WIDTH: 488,\n  MODAL_MAX_WIDTH: 600,\n  INPUT_MAX_LENGTH: 30,\n  TABLE_PAGE_SIZE: 10,\n  MAX_FILTER_CONDITIONS: 5,\n  DEBOUNCE_DELAY: 300,\n} as const;\n\n// CSS Spacing (Stitches Design Tokens)\nexport const SPACING = {\n  xs: '$2',\n  sm: '$4',\n  md: '$8',\n  lg: '$12',\n  xl: '$16',\n  '2xl': '$24',\n  '3xl': '$32',\n  '4xl': '$40',\n} as const;\n\n// Field Types\nexport const FIELD_TYPES = {\n  TEXT: 'text',\n  EMAIL: 'email',\n  PASSWORD: 'password',\n  NUMBER: 'number',\n  DATE: 'date',\n  SELECT: 'select',\n  CHECKBOX: 'checkbox',\n  RADIO: 'radio',\n  TEXTAREA: 'textarea',\n} as const;\n\n// Integration Field Types\nexport const INTEGRATION_FIELD_TYPES = {\n  STRING: 'STRING',\n  NUMBER: 'NUMBER',\n  BOOLEAN: 'BOOLEAN',\n  DATE_TIME: 'DATE_TIME',\n  EMAIL: 'EMAIL',\n  PHONE: 'PHONE',\n  URL: 'URL',\n} as const;\n\n// Survey Types\nexport const SURVEY_TYPES = {\n  CLASSIC: 'classic',\n  NPS: 'nps',\n  CHAT: 'chat',\n  KIOSK: 'kiosk',\n} as const;\n\n// Mapping Types\nexport const MAPPING_TYPES: SelectOption[] = [\n  { label: 'Question', value: 'QUESTION' },\n  { label: 'Contact', value: 'CONTACT' },\n  { label: 'Variable', value: 'VARIABLE' },\n  { label: 'Expression', value: 'EXPRESSION' },\n  { label: 'Submission Property', value: 'SUBMISSION_PROPERTY' },\n];\n\n// Data Type Options for Integration Fields\nexport const DATA_TYPE_OPTIONS: SelectOption[] = [\n  {\n    label: 'String',\n    value: 'STRING',\n  },\n  {\n    label: 'Number',\n    value: 'NUMBER',\n  },\n  {\n    label: 'Boolean',\n    value: 'BOOLEAN',\n  },\n  {\n    label: 'Date/Time',\n    value: 'DATE_TIME',\n  },\n];\n\n// Filter Operators\nexport const FILTER_OPERATORS: SelectOption[] = [\n  { label: 'is equals to', value: 'IS' },\n  { label: 'is not equals to', value: 'IS_NOT' },\n  { label: 'contains', value: 'CONTAINS' },\n  { label: 'not contains', value: 'CONTAINS_NOT' },\n  { label: 'has no value', value: 'NO_VALUE' },\n  { label: 'has any value', value: 'ANY_VALUE' },\n  { label: 'before', value: 'BEFORE' },\n  { label: 'after', value: 'AFTER' },\n  { label: 'on', value: 'ON' },\n];\n\n// Boolean Options\nexport const BOOLEAN_OPTIONS: SelectOption[] = [\n  { label: 'True', value: 'true' },\n  { label: 'False', value: 'false' },\n];\n\n// Date Options\nexport const DATE_OPTIONS: DateOption[] = [\n  {\n    label: 'Today',\n    value: 'today',\n    type: 'dynamic',\n  },\n  {\n    label: 'Yesterday',\n    value: 'yesterday',\n    type: 'dynamic',\n  },\n  {\n    label: 'Last 7 days',\n    value: 'last_7_days',\n    type: 'dynamic',\n  },\n  {\n    label: 'Last 30 days',\n    value: 'last_30_days',\n    type: 'dynamic',\n  },\n  {\n    label: 'Last 3 months',\n    value: 'last_3_months',\n    type: 'dynamic',\n  },\n  {\n    label: 'Custom Date',\n    value: 'custom',\n    type: 'static',\n  },\n];\n\n// Submission Properties for Classic Surveys\nexport const CLASSIC_SUBMISSION_PROPERTIES: SelectOption[] = [\n  { label: 'Submitted at', value: 'completed_time', type: 'STRING' },\n  { label: 'Device type', value: 'device_type', type: 'STRING' },\n  { label: 'Language', value: 'language', type: 'STRING' },\n  { label: 'Start time', value: 'start_time', type: 'STRING' },\n  { label: 'Survey ID', value: 'survey_id', type: 'STRING' },\n  { label: 'Time taken', value: 'time_taken', type: 'STRING' },\n  { label: 'Submission state', value: 'state', type: 'STRING' },\n  { label: 'Submission ID', value: 'id', type: 'STRING' },\n  { label: 'Location', value: 'location', type: 'STRING' },\n  { label: 'OS', value: 'os', type: 'STRING' },\n  { label: 'Browser', value: 'browser', type: 'STRING' },\n  { label: 'IP', value: 'ip', type: 'STRING' },\n  { label: 'Channel Type', value: 'channel_type', type: 'STRING' },\n];\n\n// Submission Properties for NPS Surveys\nexport const NPS_SUBMISSION_PROPERTIES: SelectOption[] = [\n  { label: 'Submission Start time', value: 'start_time', type: 'STRING' },\n  { label: 'Device type', value: 'device_type', type: 'STRING' },\n  { label: 'IP', value: 'ip', type: 'STRING' },\n  { label: 'Language', value: 'language', type: 'STRING' },\n  { label: 'Survey ID', value: 'survey_id', type: 'STRING' },\n  { label: 'Submission state', value: 'state', type: 'STRING' },\n  { label: 'Submission ID', value: 'id', type: 'STRING' },\n  { label: 'Time taken', value: 'time_taken', type: 'STRING' },\n  { label: 'Submitted at', value: 'completed_time', type: 'STRING' },\n  { label: 'Location', value: 'location', type: 'STRING' },\n  { label: 'OS', value: 'os', type: 'STRING' },\n  { label: 'Browser', value: 'browser', type: 'STRING' },\n];\n\n// Contact Import Frequencies\nexport const IMPORT_FREQUENCIES: SelectOption[] = [\n  { label: 'One Time', value: 'oneTime' },\n  { label: 'Daily', value: 'daily' },\n  { label: 'Weekly', value: 'weekly' },\n  { label: 'Monthly', value: 'monthly' },\n];\n\n// Time Zones (Common ones)\nexport const TIME_ZONES: SelectOption[] = [\n  { label: 'UTC', value: 'UTC' },\n  { label: 'America/New_York', value: 'America/New_York' },\n  { label: 'America/Los_Angeles', value: 'America/Los_Angeles' },\n  { label: 'Europe/London', value: 'Europe/London' },\n  { label: 'Asia/Kolkata', value: 'Asia/Kolkata' },\n  { label: 'Asia/Tokyo', value: 'Asia/Tokyo' },\n];\n\n// Notification Channels\nexport const NOTIFICATION_CHANNELS: SelectOption[] = [\n  { label: 'Email', value: 'email' },\n  { label: 'SMS', value: 'sms' },\n  { label: 'WhatsApp', value: 'whatsapp' },\n  { label: 'Slack', value: 'slack' },\n  { label: 'Webhook', value: 'webhook' },\n];\n\n// Status Options\nexport const STATUS_OPTIONS = {\n  PENDING: 'pending',\n  IN_PROGRESS: 'in_progress',\n  COMPLETED: 'completed',\n  FAILED: 'failed',\n  CANCELLED: 'cancelled',\n} as const;\n\n// Error Messages\nexport const ERROR_MESSAGES = {\n  REQUIRED_FIELD: 'This field is required',\n  INVALID_EMAIL: 'Please enter a valid email address',\n  INVALID_PHONE: 'Please enter a valid phone number',\n  INVALID_URL: 'Please enter a valid URL',\n  MIN_LENGTH: (min: number) => `Minimum ${min} characters required`,\n  MAX_LENGTH: (max: number) => `Maximum ${max} characters allowed`,\n  NETWORK_ERROR: 'Network error. Please try again.',\n  GENERIC_ERROR: 'Something went wrong. Please try again.',\n} as const;\n\n// Success Messages\nexport const SUCCESS_MESSAGES = {\n  SAVED: 'Saved successfully',\n  UPDATED: 'Updated successfully',\n  DELETED: 'Deleted successfully',\n  IMPORTED: 'Import completed successfully',\n  EXPORTED: 'Export completed successfully',\n} as const;\n\n// Loading Messages\nexport const LOADING_MESSAGES = {\n  SAVING: 'Saving...',\n  LOADING: 'Loading...',\n  PROCESSING: 'Processing...',\n  IMPORTING: 'Importing...',\n  EXPORTING: 'Exporting...',\n} as const;\n\n// Default Values\nexport const DEFAULT_VALUES = {\n  PAGE_SIZE: 10,\n  DEBOUNCE_DELAY: 300,\n  TOAST_DURATION: 3000,\n  MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n  SUPPORTED_FILE_TYPES: ['.csv', '.xlsx', '.json'],\n} as const;\n\n// Validation Rules\nexport const VALIDATION_RULES = {\n  EMAIL_REGEX: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n  PHONE_REGEX: /^\\+?[\\d\\s\\-\\(\\)]+$/,\n  URL_REGEX: /^https?:\\/\\/.+/,\n  MIN_PASSWORD_LENGTH: 8,\n  MAX_TEXT_LENGTH: 255,\n  MAX_TEXTAREA_LENGTH: 1000,\n} as const;\n\n// Re-export string constants\nexport * from './strings';\n"],"names":[],"mappings":"AAmEO,MAAM,aAAgC,GAAA;AAAA,EAC3C,EAAE,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,UAAW,EAAA;AAAA,EACvC,EAAE,KAAA,EAAO,SAAW,EAAA,KAAA,EAAO,SAAU,EAAA;AAAA,EACrC,EAAE,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,UAAW,EAAA;AAAA,EACvC,EAAE,KAAA,EAAO,YAAc,EAAA,KAAA,EAAO,YAAa,EAAA;AAAA,EAC3C,EAAE,KAAA,EAAO,qBAAuB,EAAA,KAAA,EAAO,qBAAsB,EAAA;AAC/D;;;;"}

package/dist/es/commons/constants/strings.js

@@ -0,0 +1,128 @@
+const COMPONENT_DISPLAY_NAMES = {
+  CONFIRMATION_MODAL: "ConfirmationModal",
+  CUSTOM_PILL: "CustomPill",
+  DRAFT_MODAL: "DraftModal",
+  EDIT_CONFIRMATION: "EditConfirmation",
+  IMPORT_MODAL: "ImportModal",
+  NAMING_MODAL: "NamingModal",
+  SPINNER: "Spinner",
+  THEME_WRAPPER: "ThemeWrapper",
+  ARROW_ICON: "ArrowIcon",
+  CURSOR_ICON: "CursorIcon",
+  EMAIL_LETTER_ICON: "EmailLetterIcon",
+  SMS_ICON: "SMSIcon",
+  WHATSAPP_ICON: "WhatsAppIcon",
+  TRASH_ICON: "TrashIcon",
+  SYNC_ICON: "SyncIcon",
+  MAPPING_ICON: "MappingIcon",
+  NESTED_ADD_ICON: "NestedAddIcon"
+};
+const BUTTON_TEXT = {
+  CONFIRM: "Confirm",
+  CANCEL: "Cancel",
+  SAVE: "Save",
+  YES_PROCEED: "Yes, Proceed",
+  SAVE_MAPPING: "Save Mapping",
+  UPDATE_MAPPING: "Update Mapping"
+};
+const MODAL_TITLES = {
+  YOU_WILL_BE_REDIRECTED: "You will be redirected",
+  NEW_CUSTOM_PROPERTY: "New Custom Property",
+  MAPPING_NAME: "Mapping Name"
+};
+const MODAL_DESCRIPTIONS = {
+  DRAFT_REDIRECT: "To create a new share channel, we'll navigate you to the Share section. Your changes will be saved as a draft"
+};
+const FORM_LABELS = {
+  PROPERTY_NAME: "Property Name"
+};
+const PLACEHOLDERS = {
+  ENTER_NAME_FOR_FUTURE_REFERENCE: "Enter a name for future reference",
+  PLEASE_ENTER_YOUR_QUESTION: "Please enter your question"
+};
+const ARIA_LABELS = {
+  CLOSE_MODAL: "Close modal",
+  REMOVE_PILL: "Remove pill",
+  LOADING: "Loading...",
+  ARROW: "Arrow",
+  CURSOR: "Cursor",
+  EMAIL: "Email",
+  SMS: "SMS",
+  WHATSAPP: "WhatsApp",
+  DELETE: "Delete",
+  SYNC: "Sync",
+  MAPPING: "Mapping",
+  ADD_NESTED_ITEM: "Add nested item"
+};
+const CSS_CLASS_NAMES = {
+  DM_SANS: "dm-sans"
+};
+const FONT_FAMILIES = {
+  DM_SANS: "DM Sans",
+  ROBOTO_MONO: "Roboto Mono",
+  DM_SANS_ROBOTO_MONO_SANS_SERIF: "DM Sans, Roboto Mono, sans-serif",
+  DM_SANS_IMPORTANT: "DM Sans !important"
+};
+const COLORS = {
+  BLACK: "black",
+  ICON_GRAY: "#6A6A6A",
+  ICON_GRAY_DARK: "#64748B",
+  ICON_GRAY_MEDIUM: "#767676",
+  DEFAULT: "default",
+  ERROR: "error",
+  SECONDARY: "secondary",
+  PRIMARY: "primary"
+};
+const SIZE_VALUES = {
+  LARGE: "lg",
+  MEDIUM: "md",
+  SMALL: "sm"
+};
+const VARIANTS = {
+  SOLID: "solid",
+  GHOST: "ghost",
+  DEFAULT: "default",
+  SUCCESS: "success"
+};
+const ATTRIBUTES = {
+  STATUS: "status",
+  IMG: "img"
+};
+const BORDER_RADIUS = {
+  EIGHT_PX: "8px",
+  NINETY_NINE_PX: "99px"
+};
+const NUMERIC_CONSTANTS = {
+  CLOSE_ICON_SIZE: 12,
+  MAX_LENGTH_DEFAULT: 50,
+  MIN_WIDTH_464PX: "464px",
+  BUTTON_WIDTH_106PX: "106px"
+};
+const CONSOLE_MESSAGES = {
+  ERROR_DURING_CONFIRMATION: "Error during confirmation:",
+  UNKNOWN_MAPPING_TYPE: (mappingType) => `Unknown mapping type: ${mappingType}`,
+  FAILED_TO_SAVE_TO_LOCALSTORAGE: "Failed to save to localStorage:",
+  FAILED_TO_REMOVE_FROM_LOCALSTORAGE: "Failed to remove from localStorage:"
+};
+const HELPER_STRINGS = {
+  MAPPING_TYPES: {
+    QUESTION: "QUESTION",
+    CONTACT: "CONTACT",
+    VARIABLE: "VARIABLE",
+    EXPRESSION: "EXPRESSION",
+    SUBMISSION_PROPERTY: "SUBMISSION_PROPERTY"
+  },
+  SURVEY_TYPES: {
+    CLASSIC_FORM: "classicform"
+  },
+  EXCLUDED_QUESTION_TYPES: ["Message", "PaymentQuestion"],
+  EXCLUDED_CONTACT_PROPERTIES: ["team_internal", "department_internal"],
+  LABEL_PREFIX: "- ",
+  ID_PREFIX: "id-",
+  CONSOLE_MESSAGES: {
+    UNKNOWN_MAPPING_TYPE: (mappingType) => `Unknown mapping type: ${mappingType}`
+  }
+};
+
+export { ARIA_LABELS, ATTRIBUTES, BORDER_RADIUS, BUTTON_TEXT, COLORS, COMPONENT_DISPLAY_NAMES, CONSOLE_MESSAGES, CSS_CLASS_NAMES, FONT_FAMILIES, FORM_LABELS, HELPER_STRINGS, MODAL_DESCRIPTIONS, MODAL_TITLES, NUMERIC_CONSTANTS, PLACEHOLDERS, SIZE_VALUES, VARIANTS };
+//# sourceMappingURL=strings.js.map

package/dist/es/commons/constants/strings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"strings.js","sources":["../../../../src/commons/constants/strings.ts"],"sourcesContent":["/**\n * String Constants for Commons Module\n * \n * This file contains all hardcoded strings used across the commons module.\n * Organized by component/feature for easy reference and maintenance.\n */\n\n// ============================================================================\n// Component Display Names\n// ============================================================================\nexport const COMPONENT_DISPLAY_NAMES = {\n  CONFIRMATION_MODAL: 'ConfirmationModal',\n  CUSTOM_PILL: 'CustomPill',\n  DRAFT_MODAL: 'DraftModal',\n  EDIT_CONFIRMATION: 'EditConfirmation',\n  IMPORT_MODAL: 'ImportModal',\n  NAMING_MODAL: 'NamingModal',\n  SPINNER: 'Spinner',\n  THEME_WRAPPER: 'ThemeWrapper',\n  ARROW_ICON: 'ArrowIcon',\n  CURSOR_ICON: 'CursorIcon',\n  EMAIL_LETTER_ICON: 'EmailLetterIcon',\n  SMS_ICON: 'SMSIcon',\n  WHATSAPP_ICON: 'WhatsAppIcon',\n  TRASH_ICON: 'TrashIcon',\n  SYNC_ICON: 'SyncIcon',\n  MAPPING_ICON: 'MappingIcon',\n  NESTED_ADD_ICON: 'NestedAddIcon',\n} as const;\n\n// ============================================================================\n// Button Text\n// ============================================================================\nexport const BUTTON_TEXT = {\n  CONFIRM: 'Confirm',\n  CANCEL: 'Cancel',\n  SAVE: 'Save',\n  YES_PROCEED: 'Yes, Proceed',\n  SAVE_MAPPING: 'Save Mapping',\n  UPDATE_MAPPING: 'Update Mapping',\n} as const;\n\n// ============================================================================\n// Modal Titles\n// ============================================================================\nexport const MODAL_TITLES = {\n  YOU_WILL_BE_REDIRECTED: 'You will be redirected',\n  NEW_CUSTOM_PROPERTY: 'New Custom Property',\n  MAPPING_NAME: 'Mapping Name',\n} as const;\n\n// ============================================================================\n// Modal Descriptions\n// ============================================================================\nexport const MODAL_DESCRIPTIONS = {\n  DRAFT_REDIRECT: \"To create a new share channel, we'll navigate you to the Share section. Your changes will be saved as a draft\",\n} as const;\n\n// ============================================================================\n// Form Labels\n// ============================================================================\nexport const FORM_LABELS = {\n  PROPERTY_NAME: 'Property Name',\n} as const;\n\n// ============================================================================\n// Placeholders\n// ============================================================================\nexport const PLACEHOLDERS = {\n  ENTER_NAME_FOR_FUTURE_REFERENCE: 'Enter a name for future reference',\n  PLEASE_ENTER_YOUR_QUESTION: 'Please enter your question',\n} as const;\n\n// ============================================================================\n// Aria Labels (Accessibility)\n// ============================================================================\nexport const ARIA_LABELS = {\n  CLOSE_MODAL: 'Close modal',\n  REMOVE_PILL: 'Remove pill',\n  LOADING: 'Loading...',\n  ARROW: 'Arrow',\n  CURSOR: 'Cursor',\n  EMAIL: 'Email',\n  SMS: 'SMS',\n  WHATSAPP: 'WhatsApp',\n  DELETE: 'Delete',\n  SYNC: 'Sync',\n  MAPPING: 'Mapping',\n  ADD_NESTED_ITEM: 'Add nested item',\n} as const;\n\n// ============================================================================\n// CSS Class Names\n// ============================================================================\nexport const CSS_CLASS_NAMES = {\n  DM_SANS: 'dm-sans',\n} as const;\n\n// ============================================================================\n// Font Families\n// ============================================================================\nexport const FONT_FAMILIES = {\n  DM_SANS: 'DM Sans',\n  ROBOTO_MONO: 'Roboto Mono',\n  DM_SANS_ROBOTO_MONO_SANS_SERIF: 'DM Sans, Roboto Mono, sans-serif',\n  DM_SANS_IMPORTANT: 'DM Sans !important',\n} as const;\n\n// ============================================================================\n// Colors (Non-CSS)\n// ============================================================================\nexport const COLORS = {\n  BLACK: 'black',\n  ICON_GRAY: '#6A6A6A',\n  ICON_GRAY_DARK: '#64748B',\n  ICON_GRAY_MEDIUM: '#767676',\n  DEFAULT: 'default',\n  ERROR: 'error',\n  SECONDARY: 'secondary',\n  PRIMARY: 'primary',\n} as const;\n\n// ============================================================================\n// Size Values\n// ============================================================================\nexport const SIZE_VALUES = {\n  LARGE: 'lg',\n  MEDIUM: 'md',\n  SMALL: 'sm',\n} as const;\n\n// ============================================================================\n// Variants\n// ============================================================================\nexport const VARIANTS = {\n  SOLID: 'solid',\n  GHOST: 'ghost',\n  DEFAULT: 'default',\n  SUCCESS: 'success',\n} as const;\n\n// ============================================================================\n// Status/Role Attributes\n// ============================================================================\nexport const ATTRIBUTES = {\n  STATUS: 'status',\n  IMG: 'img',\n} as const;\n\n// ============================================================================\n// Border Radius Values\n// ============================================================================\nexport const BORDER_RADIUS = {\n  EIGHT_PX: '8px',\n  NINETY_NINE_PX: '99px',\n} as const;\n\n// ============================================================================\n// Numeric Constants (for components)\n// ============================================================================\nexport const NUMERIC_CONSTANTS = {\n  CLOSE_ICON_SIZE: 12,\n  MAX_LENGTH_DEFAULT: 50,\n  MIN_WIDTH_464PX: '464px',\n  BUTTON_WIDTH_106PX: '106px',\n} as const;\n\n// ============================================================================\n// Console Messages\n// ============================================================================\nexport const CONSOLE_MESSAGES = {\n  ERROR_DURING_CONFIRMATION: 'Error during confirmation:',\n  UNKNOWN_MAPPING_TYPE: (mappingType: string) => `Unknown mapping type: ${mappingType}`,\n  FAILED_TO_SAVE_TO_LOCALSTORAGE: 'Failed to save to localStorage:',\n  FAILED_TO_REMOVE_FROM_LOCALSTORAGE: 'Failed to remove from localStorage:',\n} as const;\n\n// ============================================================================\n// File Size Units\n// ============================================================================\nexport const FILE_SIZE_UNITS = {\n  BYTES: 'Bytes',\n  KB: 'KB',\n  MB: 'MB',\n  GB: 'GB',\n} as const;\n\n// ============================================================================\n// Sort Directions\n// ============================================================================\nexport const SORT_DIRECTIONS = {\n  ASC: 'asc',\n  DESC: 'desc',\n} as const;\n\n// ============================================================================\n// Date Format Patterns\n// ============================================================================\nexport const DATE_FORMATS = {\n  YYYY_MM_DD: 'YYYY-MM-DD',\n} as const;\n\n// ============================================================================\n// Helper Strings\n// ============================================================================\nexport const HELPER_STRINGS = {\n  MAPPING_TYPES: {\n    QUESTION: 'QUESTION',\n    CONTACT: 'CONTACT',\n    VARIABLE: 'VARIABLE',\n    EXPRESSION: 'EXPRESSION',\n    SUBMISSION_PROPERTY: 'SUBMISSION_PROPERTY',\n  },\n  SURVEY_TYPES: {\n    CLASSIC_FORM: 'classicform',\n  },\n  EXCLUDED_QUESTION_TYPES: ['Message', 'PaymentQuestion'] as const,\n  EXCLUDED_CONTACT_PROPERTIES: ['team_internal', 'department_internal'] as const,\n  LABEL_PREFIX: '- ',\n  ID_PREFIX: 'id-',\n  CONSOLE_MESSAGES: {\n    UNKNOWN_MAPPING_TYPE: (mappingType: string) => `Unknown mapping type: ${mappingType}`,\n  },\n} as const;\n\n// ============================================================================\n// Utils Strings\n// ============================================================================\nexport const UTILS_STRINGS = {\n  ZERO_BYTES: '0 Bytes',\n  EMPTY_STRING: '',\n  TRUE: 'true',\n  FALSE: 'false',\n  COMMA_SPACE: ', ',\n  UNKNOWN_ERROR_OCCURRED: 'An unknown error occurred',\n  SPACE: ' ',\n  DOT: '.',\n} as const;\n\n"],"names":[],"mappings":"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"}