npm - @123usmanhaider321/ui - Versions diffs - 0.1.0 → 0.1.8 - Mend

@123usmanhaider321/ui 0.1.0 → 0.1.8

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

Files changed (1322) hide show

package/dist/components/ConfirmationModal/ConfirmationModal.js CHANGED Viewed

@@ -1,12 +1,10 @@
-import { j as jsxRuntimeExports } from "../../node_modules/react/jsx-runtime.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Transition, Dialog } from "@headlessui/react";
+import { AlertTriangle, X } from "lucide-react";
 import { useState, Fragment } from "react";
-import { FaCircleNotch } from "../../node_modules/react-icons/fa/index.js";
-import { Button } from "../Button/Button.js";
+import { FaCircleNotch } from "react-icons/fa";
 import Modal from "../Modal/Modal.js";
-import { Transition as Ke } from "../../node_modules/@headlessui/react/dist/components/transition/transition.js";
-import { Dialog as ht } from "../../node_modules/@headlessui/react/dist/components/dialog/dialog.js";
-import TriangleAlert from "../../node_modules/lucide-react/dist/esm/icons/triangle-alert.js";
-import X from "../../node_modules/lucide-react/dist/esm/icons/x.js";
+import { Button } from "../Button/Button.js";
 function ConfirmationModal({
   open,
   title,
@@ -44,57 +42,57 @@ function ConfirmationModal({
     }
   };
   const isSubmitDisabled = loading || (confirmationKeyword ? confirmInput !== confirmationKeyword : false);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsx(
     Modal,
     {
       open,
       handleClose,
       closeOnEscape: false,
       closeOnOutsideClick: false,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-fixed ui-inset-0 ui-z-10 ui-overflow-y-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-flex ui-min-h-full ui-items-center ui-justify-center ui-p-4 ui-text-center sm:ui-p-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Ke.Child,
+      children: /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-10 overflow-y-auto", children: /* @__PURE__ */ jsx("div", { className: "flex min-h-full items-center justify-center p-4 text-center sm:p-0", children: /* @__PURE__ */ jsx(
+        Transition.Child,
         {
           as: Fragment,
-          enter: "ui-ease-out ui-duration-300",
-          enterFrom: "ui-opacity-0 ui-translate-y-4 sm:ui-translate-y-0 sm:ui-scale-95",
-          enterTo: "ui-opacity-100 ui-translate-y-0 sm:ui-scale-100",
-          leave: "ui-ease-in ui-duration-200",
-          leaveFrom: "ui-opacity-100 ui-translate-y-0 sm:ui-scale-100",
-          leaveTo: "ui-opacity-0 ui-translate-y-4 sm:ui-translate-y-0 sm:ui-scale-95",
-          children: /* @__PURE__ */ jsxRuntimeExports.jsxs(ht.Panel, { className: "ui-flex ui-flex-col ui-gap-6 ui-relative ui-transform ui-overflow-hidden ui-rounded-xl ui-bg-white ui-text-left ui-shadow-xl ui-transition-all ui-mx-auto ui-px-4 sm:ui-px-6 ui-py-4 sm:ui-py-6 ui-w-full ui-max-w-lg", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-shrink-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-text-start", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ui-flex ui-justify-between ui-items-start", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ui-flex ui-items-center ui-gap-3", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-shrink-0 ui-flex ui-items-center ui-justify-center ui-h-10 ui-w-10 ui-rounded-full ui-bg-red-100", children: /* @__PURE__ */ jsxRuntimeExports.jsx(TriangleAlert, { className: "ui-h-5 ui-w-5 ui-text-red-600", "aria-hidden": "true" }) }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(ht.Title, { as: "h3", className: "ui-text-lg ui-font-semibold ui-leading-6 ui-text-gray-900 ui-pt-2", id: "modal-title", children: title })
+          enter: "ease-out duration-300",
+          enterFrom: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",
+          enterTo: "opacity-100 translate-y-0 sm:scale-100",
+          leave: "ease-in duration-200",
+          leaveFrom: "opacity-100 translate-y-0 sm:scale-100",
+          leaveTo: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",
+          children: /* @__PURE__ */ jsxs(Dialog.Panel, { className: "flex flex-col gap-6 relative transform overflow-hidden rounded-xl bg-white text-left shadow-xl transition-all mx-auto px-4 sm:px-6 py-4 sm:py-6 w-full max-w-lg", children: [
+            /* @__PURE__ */ jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsx("div", { className: "text-start", children: /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-start", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsx("div", { className: "shrink-0 flex items-center justify-center h-10 w-10 rounded-full bg-red-100", children: /* @__PURE__ */ jsx(AlertTriangle, { className: "h-5 w-5 text-red-600", "aria-hidden": "true" }) }),
+                /* @__PURE__ */ jsx(Dialog.Title, { as: "h3", className: "text-lg font-semibold leading-6 text-gray-900 pt-2", id: "modal-title", children: title })
               ] }),
-              /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              /* @__PURE__ */ jsxs(
                 "button",
                 {
                   type: "button",
-                  className: "ui-text-gray-400 hover:ui-text-gray-500 ui-transition-colors ui-bg-transparent ui-rounded-md ui-p-1 hover:ui-bg-gray-100",
+                  className: "text-gray-400 hover:text-gray-500 transition-colors bg-transparent rounded-md p-1 hover:bg-gray-100",
                   onClick: handleClose,
                   "aria-label": "Close modal",
                   children: [
-                    /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ui-sr-only", children: "Close" }),
-                    /* @__PURE__ */ jsxRuntimeExports.jsx(X, { height: 20, width: 20 })
+                    /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" }),
+                    /* @__PURE__ */ jsx(X, { height: 20, width: 20 })
                   ]
                 }
               )
             ] }) }) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ui-text-sm ui-text-gray-600", children: [
-              description && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: description }),
-              children && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-mt-4", children }),
-              confirmationKeyword && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ui-mt-4", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "ui-block ui-text-sm ui-font-medium ui-text-gray-700 ui-mb-2", children: [
+            /* @__PURE__ */ jsxs("div", { className: "text-sm text-gray-600", children: [
+              description && /* @__PURE__ */ jsx("p", { children: description }),
+              children && /* @__PURE__ */ jsx("div", { className: "mt-4", children }),
+              confirmationKeyword && /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
+                /* @__PURE__ */ jsxs("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: [
                   "Type ",
-                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ui-font-bold ui-select-all", children: confirmationKeyword }),
+                  /* @__PURE__ */ jsx("span", { className: "font-bold select-all", children: confirmationKeyword }),
                   " to confirm"
                 ] }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                /* @__PURE__ */ jsx(
                   "input",
                   {
                     type: "text",
-                    className: "ui-w-full ui-rounded-lg ui-border-gray-300 ui-shadow-sm focus:ui-border-red-500 focus:ui-ring-red-500 sm:ui-text-sm ui-px-3 ui-py-2 ui-border",
+                    className: "w-full rounded-lg border-gray-300 shadow-sm focus:border-red-500 focus:ring-red-500 sm:text-sm px-3 py-2 border",
                     placeholder: `Type "${confirmationKeyword}"`,
                     value: confirmInput,
                     onChange: (e) => setConfirmInput(e.target.value),
@@ -104,25 +102,25 @@ function ConfirmationModal({
                 )
               ] })
             ] }),
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: handleSubmit, className: "ui-flex ui-flex-col sm:ui-flex-row sm:ui-gap-3 ui-justify-end ui-bg-gray-50", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
+            /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col sm:flex-row sm:gap-3 justify-end bg-gray-50", children: [
+              /* @__PURE__ */ jsx(
                 Button,
                 {
                   type: "button",
                   variant: "outline",
-                  className: "ui-flex-1 ui-h-11",
+                  className: "flex-1 h-11",
                   onClick: handleClose,
                   disabled: loading,
                   children: cancelText
                 }
               ),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
+              /* @__PURE__ */ jsx(
                 Button,
                 {
                   type: "submit",
-                  className: "ui-flex-1 ui-h-11",
+                  className: "flex-1 h-11",
                   disabled: isSubmitDisabled,
-                  children: loading ? /* @__PURE__ */ jsxRuntimeExports.jsx(FaCircleNotch, { size: 18, className: "ui-animate-spin" }) : confirmText
+                  children: loading ? /* @__PURE__ */ jsx(FaCircleNotch, { size: 18, className: "animate-spin" }) : confirmText
                 }
               )
             ] })

package/dist/components/ConfirmationModal/ConfirmationModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfirmationModal.js","sources":["../../../src/components/ConfirmationModal/ConfirmationModal.tsx"],"sourcesContent":["import { Dialog, Transition } from '@headlessui/react'\nimport { X, AlertTriangle } from 'lucide-react';\nimport { FormEvent, Fragment, ReactNode, useState } from 'react';\nimport { FaCircleNotch } from 'react-icons/fa';\n\nimport { Button } from '../Button';\nimport Modal from '../Modal/Modal';\nimport { cn } from '../../utils/cn';\n\nexport interface ConfirmationModalProps {\n open: boolean;\n title: string;\n description?: string;\n onClose: () => void;\n onConfirm: () => Promise<void> \| void;\n confirmText?: string;\n cancelText?: string;\n children?: ReactNode;\n isLoading?: boolean;\n confirmationKeyword?: string;\n}\n\nexport default function ConfirmationModal({\n open,\n title,\n description,\n onClose,\n onConfirm,\n confirmText = \"Confirm\",\n cancelText = \"Cancel\",\n children,\n isLoading,\n confirmationKeyword\n}: ConfirmationModalProps) {\n const [internalLoading, setInternalLoading] = useState(false);\n const [confirmInput, setConfirmInput] = useState(\"\");\n\n const loading = isLoading ?? internalLoading;\n\n const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {\n e.preventDefault();\n e.stopPropagation();\n if (!loading) {\n if (confirmationKeyword && confirmInput !== confirmationKeyword) {\n return;\n }\n try {\n setInternalLoading(true);\n await onConfirm();\n }\n finally {\n setInternalLoading(false);\n }\n }\n }\n\n const handleClose = () => {\n if (!loading) {\n onClose();\n setConfirmInput(\"\");\n }\n }\n\n const isSubmitDisabled = loading \|\| (confirmationKeyword ? confirmInput !== confirmationKeyword : false);\n\n return (\n <Modal\n open={open}\n handleClose={handleClose}\n closeOnEscape={false}\n closeOnOutsideClick={false}\n >\n <div className=\"ui-fixed ui-inset-0 ui-z-10 ui-overflow-y-auto\">\n <div className=\"ui-flex ui-min-h-full ui-items-center ui-justify-center ui-p-4 ui-text-center sm:ui-p-0\">\n <Transition.Child\n as={Fragment}\n enter=\"ui-ease-out ui-duration-300\"\n enterFrom=\"ui-opacity-0 ui-translate-y-4 sm:ui-translate-y-0 sm:ui-scale-95\"\n enterTo=\"ui-opacity-100 ui-translate-y-0 sm:ui-scale-100\"\n leave=\"ui-ease-in ui-duration-200\"\n leaveFrom=\"ui-opacity-100 ui-translate-y-0 sm:ui-scale-100\"\n leaveTo=\"ui-opacity-0 ui-translate-y-4 sm:ui-translate-y-0 sm:ui-scale-95\"\n >\n <Dialog.Panel className=\"ui-flex ui-flex-col ui-gap-6 ui-relative ui-transform ui-overflow-hidden ui-rounded-xl ui-bg-white ui-text-left ui-shadow-xl ui-transition-all ui-mx-auto ui-px-4 sm:ui-px-6 ui-py-4 sm:ui-py-6 ui-w-full ui-max-w-lg\">\n <div className=\"ui-shrink-0\">\n <div className=\"ui-text-start\">\n <div className=\"ui-flex ui-justify-between ui-items-start\">\n <div className=\"ui-flex ui-items-center ui-gap-3\">\n <div className=\"ui-shrink-0 ui-flex ui-items-center ui-justify-center ui-h-10 ui-w-10 ui-rounded-full ui-bg-red-100\">\n <AlertTriangle className=\"ui-h-5 ui-w-5 ui-text-red-600\" aria-hidden=\"true\" />\n </div>\n <Dialog.Title as=\"h3\" className=\"ui-text-lg ui-font-semibold ui-leading-6 ui-text-gray-900 ui-pt-2\" id=\"modal-title\">\n {title}\n </Dialog.Title>\n </div>\n <button\n type=\"button\"\n className=\"ui-text-gray-400 hover:ui-text-gray-500 ui-transition-colors ui-bg-transparent ui-rounded-md ui-p-1 hover:ui-bg-gray-100\"\n onClick={handleClose}\n aria-label=\"Close modal\"\n >\n <span className=\"ui-sr-only\">Close</span>\n <X height={20} width={20} />\n </button>\n </div>\n </div>\n </div>\n\n <div className=\"ui-text-sm ui-text-gray-600\">\n {description && <p>{description}</p>}\n {children && <div className=\"ui-mt-4\">{children}</div>}\n\n {confirmationKeyword && (\n <div className=\"ui-mt-4\">\n <label className=\"ui-block ui-text-sm ui-font-medium ui-text-gray-700 ui-mb-2\">\n Type <span className=\"ui-font-bold ui-select-all\">{confirmationKeyword}</span> to confirm\n </label>\n <input\n type=\"text\"\n className=\"ui-w-full ui-rounded-lg ui-border-gray-300 ui-shadow-sm focus:ui-border-red-500 focus:ui-ring-red-500 sm:ui-text-sm ui-px-3 ui-py-2 ui-border\"\n placeholder={`Type \"${confirmationKeyword}\"`}\n value={confirmInput}\n onChange={(e) => setConfirmInput(e.target.value)}\n onPaste={(e) => e.preventDefault()}\n autoComplete='off'\n />\n </div>\n )}\n </div>\n\n\n <form onSubmit={handleSubmit} className=\"ui-flex ui-flex-col sm:ui-flex-row sm:ui-gap-3 ui-justify-end ui-bg-gray-50\">\n <Button\n type=\"button\"\n variant=\"outline\"\n className=\"ui-flex-1 ui-h-11\"\n onClick={handleClose}\n disabled={loading}\n >\n {cancelText}\n </Button>\n <Button\n type=\"submit\"\n className=\"ui-flex-1 ui-h-11\"\n disabled={isSubmitDisabled}\n >\n {\n loading ? <FaCircleNotch size={18} className=\"ui-animate-spin\" /> : confirmText\n }\n </Button>\n </form>\n </Dialog.Panel>\n </Transition.Child>\n </div>\n </div>\n </Modal>\n )\n}\n"],"names":["jsx","Transition","jsxs","Dialog","AlertTriangle"],"mappings":";;;;;;;;;AAsBA,SAAwB,kBAAkB;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACJ,GAA2B;AACvB,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAC5D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,EAAE;AAEnD,QAAM,UAAU,aAAa;AAE7B,QAAM,eAAe,OAAO,MAAkC;AAC1D,MAAE,eAAA;AACF,MAAE,gBAAA;AACF,QAAI,CAAC,SAAS;AACV,UAAI,uBAAuB,iBAAiB,qBAAqB;AAC7D;AAAA,MACJ;AACA,UAAI;AACA,2BAAmB,IAAI;AACvB,cAAM,UAAA;AAAA,MACV,UAAA;AAEI,2BAAmB,KAAK;AAAA,MAC5B;AAAA,IACJ;AAAA,EACJ;AAEA,QAAM,cAAc,MAAM;AACtB,QAAI,CAAC,SAAS;AACV,cAAA;AACA,sBAAgB,EAAE;AAAA,IACtB;AAAA,EACJ;AAEA,QAAM,mBAAmB,YAAY,sBAAsB,iBAAiB,sBAAsB;AAElG,SACIA,kCAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACG;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf,qBAAqB;AAAA,MAErB,gDAAC,OAAA,EAAI,WAAU,kDACX,UAAAA,kCAAAA,IAAC,OAAA,EAAI,WAAU,2FACX,UAAAA,kCAAAA;AAAAA,QAACC,GAAW;AAAA,QAAX;AAAA,UACG,IAAI;AAAA,UACJ,OAAM;AAAA,UACN,WAAU;AAAA,UACV,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,WAAU;AAAA,UACV,SAAQ;AAAA,UAER,UAAAC,kCAAAA,KAACC,GAAO,OAAP,EAAa,WAAU,yNACpB,UAAA;AAAA,YAAAH,kCAAAA,IAAC,OAAA,EAAI,WAAU,eACX,UAAAA,kCAAAA,IAAC,OAAA,EAAI,WAAU,iBACX,UAAAE,uCAAC,OAAA,EAAI,WAAU,6CACX,UAAA;AAAA,cAAAA,kCAAAA,KAAC,OAAA,EAAI,WAAU,oCACX,UAAA;AAAA,gBAAAF,kCAAAA,IAAC,OAAA,EAAI,WAAU,uGACX,UAAAA,kCAAAA,IAACI,iBAAc,WAAU,iCAAgC,eAAY,OAAA,CAAO,EAAA,CAChF;AAAA,gBACAJ,kCAAAA,IAACG,GAAO,OAAP,EAAa,IAAG,MAAK,WAAU,qEAAoE,IAAG,eAClG,UAAA,MAAA,CACL;AAAA,cAAA,GACJ;AAAA,cACAD,kCAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,MAAK;AAAA,kBACL,WAAU;AAAA,kBACV,SAAS;AAAA,kBACT,cAAW;AAAA,kBAEX,UAAA;AAAA,oBAAAF,kCAAAA,IAAC,QAAA,EAAK,WAAU,cAAa,UAAA,SAAK;AAAA,oBAClCA,kCAAAA,IAAC,GAAA,EAAE,QAAQ,IAAI,OAAO,GAAA,CAAI;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAC9B,EAAA,CACJ,GACJ,GACJ;AAAA,YAEAE,kCAAAA,KAAC,OAAA,EAAI,WAAU,+BACV,UAAA;AAAA,cAAA,eAAeF,kCAAAA,IAAC,OAAG,UAAA,YAAA,CAAY;AAAA,cAC/B,YAAYA,kCAAAA,IAAC,OAAA,EAAI,WAAU,WAAW,UAAS;AAAA,cAE/C,uBACGE,kCAAAA,KAAC,OAAA,EAAI,WAAU,WACX,UAAA;AAAA,gBAAAA,kCAAAA,KAAC,SAAA,EAAM,WAAU,+DAA8D,UAAA;AAAA,kBAAA;AAAA,kBACtEF,kCAAAA,IAAC,QAAA,EAAK,WAAU,8BAA8B,UAAA,qBAAoB;AAAA,kBAAO;AAAA,gBAAA,GAClF;AAAA,gBACAA,kCAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACG,MAAK;AAAA,oBACL,WAAU;AAAA,oBACV,aAAa,SAAS,mBAAmB;AAAA,oBACzC,OAAO;AAAA,oBACP,UAAU,CAAC,MAAM,gBAAgB,EAAE,OAAO,KAAK;AAAA,oBAC/C,SAAS,CAAC,MAAM,EAAE,eAAA;AAAA,oBAClB,cAAa;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACjB,EAAA,CACJ;AAAA,YAAA,GAER;AAAA,YAGAE,kCAAAA,KAAC,QAAA,EAAK,UAAU,cAAc,WAAU,+EACpC,UAAA;AAAA,cAAAF,kCAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,MAAK;AAAA,kBACL,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,SAAS;AAAA,kBACT,UAAU;AAAA,kBAET,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,cAELA,kCAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,MAAK;AAAA,kBACL,WAAU;AAAA,kBACV,UAAU;AAAA,kBAGN,oBAAUA,kCAAAA,IAAC,eAAA,EAAc,MAAM,IAAI,WAAU,mBAAkB,IAAK;AAAA,gBAAA;AAAA,cAAA;AAAA,YAE5E,EAAA,CACJ;AAAA,UAAA,EAAA,CACJ;AAAA,QAAA;AAAA,MAAA,GAER,EAAA,CACJ;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
1	+ {"version":3,"file":"ConfirmationModal.js","sources":["../../../src/components/ConfirmationModal/ConfirmationModal.tsx"],"sourcesContent":["import { Dialog, Transition } from '@headlessui/react'\r\nimport { X, AlertTriangle } from 'lucide-react';\r\nimport { FormEvent, Fragment, ReactNode, useState } from 'react';\r\nimport { FaCircleNotch } from 'react-icons/fa';\r\n\r\nimport { Button } from '../Button';\r\nimport Modal from '../Modal/Modal';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport interface ConfirmationModalProps {\r\n open: boolean;\r\n title: string;\r\n description?: string;\r\n onClose: () => void;\r\n onConfirm: () => Promise<void> \| void;\r\n confirmText?: string;\r\n cancelText?: string;\r\n children?: ReactNode;\r\n isLoading?: boolean;\r\n confirmationKeyword?: string;\r\n}\r\n\r\nexport default function ConfirmationModal({\r\n open,\r\n title,\r\n description,\r\n onClose,\r\n onConfirm,\r\n confirmText = \"Confirm\",\r\n cancelText = \"Cancel\",\r\n children,\r\n isLoading,\r\n confirmationKeyword\r\n}: ConfirmationModalProps) {\r\n const [internalLoading, setInternalLoading] = useState(false);\r\n const [confirmInput, setConfirmInput] = useState(\"\");\r\n\r\n const loading = isLoading ?? internalLoading;\r\n\r\n const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n if (!loading) {\r\n if (confirmationKeyword && confirmInput !== confirmationKeyword) {\r\n return;\r\n }\r\n try {\r\n setInternalLoading(true);\r\n await onConfirm();\r\n }\r\n finally {\r\n setInternalLoading(false);\r\n }\r\n }\r\n }\r\n\r\n const handleClose = () => {\r\n if (!loading) {\r\n onClose();\r\n setConfirmInput(\"\");\r\n }\r\n }\r\n\r\n const isSubmitDisabled = loading \|\| (confirmationKeyword ? confirmInput !== confirmationKeyword : false);\r\n\r\n return (\r\n <Modal\r\n open={open}\r\n handleClose={handleClose}\r\n closeOnEscape={false}\r\n closeOnOutsideClick={false}\r\n >\r\n <div className=\"fixed inset-0 z-10 overflow-y-auto\">\r\n <div className=\"flex min-h-full items-center justify-center p-4 text-center sm:p-0\">\r\n <Transition.Child\r\n as={Fragment}\r\n enter=\"ease-out duration-300\"\r\n enterFrom=\"opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95\"\r\n enterTo=\"opacity-100 translate-y-0 sm:scale-100\"\r\n leave=\"ease-in duration-200\"\r\n leaveFrom=\"opacity-100 translate-y-0 sm:scale-100\"\r\n leaveTo=\"opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95\"\r\n >\r\n <Dialog.Panel className=\"flex flex-col gap-6 relative transform overflow-hidden rounded-xl bg-white text-left shadow-xl transition-all mx-auto px-4 sm:px-6 py-4 sm:py-6 w-full max-w-lg\">\r\n <div className=\"shrink-0\">\r\n <div className=\"text-start\">\r\n <div className=\"flex justify-between items-start\">\r\n <div className=\"flex items-center gap-3\">\r\n <div className=\"shrink-0 flex items-center justify-center h-10 w-10 rounded-full bg-red-100\">\r\n <AlertTriangle className=\"h-5 w-5 text-red-600\" aria-hidden=\"true\" />\r\n </div>\r\n <Dialog.Title as=\"h3\" className=\"text-lg font-semibold leading-6 text-gray-900 pt-2\" id=\"modal-title\">\r\n {title}\r\n </Dialog.Title>\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"text-gray-400 hover:text-gray-500 transition-colors bg-transparent rounded-md p-1 hover:bg-gray-100\"\r\n onClick={handleClose}\r\n aria-label=\"Close modal\"\r\n >\r\n <span className=\"sr-only\">Close</span>\r\n <X height={20} width={20} />\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div className=\"text-sm text-gray-600\">\r\n {description && <p>{description}</p>}\r\n {children && <div className=\"mt-4\">{children}</div>}\r\n\r\n {confirmationKeyword && (\r\n <div className=\"mt-4\">\r\n <label className=\"block text-sm font-medium text-gray-700 mb-2\">\r\n Type <span className=\"font-bold select-all\">{confirmationKeyword}</span> to confirm\r\n </label>\r\n <input\r\n type=\"text\"\r\n className=\"w-full rounded-lg border-gray-300 shadow-sm focus:border-red-500 focus:ring-red-500 sm:text-sm px-3 py-2 border\"\r\n placeholder={`Type \"${confirmationKeyword}\"`}\r\n value={confirmInput}\r\n onChange={(e) => setConfirmInput(e.target.value)}\r\n onPaste={(e) => e.preventDefault()}\r\n autoComplete='off'\r\n />\r\n </div>\r\n )}\r\n </div>\r\n\r\n\r\n <form onSubmit={handleSubmit} className=\"flex flex-col sm:flex-row sm:gap-3 justify-end bg-gray-50\">\r\n <Button\r\n type=\"button\"\r\n variant=\"outline\"\r\n className=\"flex-1 h-11\"\r\n onClick={handleClose}\r\n disabled={loading}\r\n >\r\n {cancelText}\r\n </Button>\r\n <Button\r\n type=\"submit\"\r\n className=\"flex-1 h-11\"\r\n disabled={isSubmitDisabled}\r\n >\r\n {\r\n loading ? <FaCircleNotch size={18} className=\"animate-spin\" /> : confirmText\r\n }\r\n </Button>\r\n </form>\r\n </Dialog.Panel>\r\n </Transition.Child>\r\n </div>\r\n </div>\r\n </Modal>\r\n )\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/components/CustomSelect/CustomSelect.js CHANGED Viewed

@@ -1,14 +1,12 @@
-import { j as jsxRuntimeExports } from "../../node_modules/react/jsx-runtime.js";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { memo, useState, useRef, useEffect } from "react";
 import { createPortal } from "react-dom";
+import { ChevronDown, Check } from "lucide-react";
+import { AnimatePresence, motion } from "framer-motion";
 import { cn } from "../../utils/cn.js";
 import FormInput from "../FormInput/FormInput.js";
 import { Tooltip } from "../Tooltip/Tooltip.js";
 import { Checkbox } from "../Checkbox/Checkbox.js";
-import ChevronDown from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
-import { AnimatePresence } from "../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.js";
-import { motion } from "../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";
-import Check from "../../node_modules/lucide-react/dist/esm/icons/check.js";
 const CustomSelect = ({
   value,
   onChange,
@@ -119,30 +117,30 @@ const CustomSelect = ({
       setIsOpen(false);
     }
   };
-  const TriggerContent = /* @__PURE__ */ jsxRuntimeExports.jsxs(
+  const TriggerContent = /* @__PURE__ */ jsxs(
     "button",
     {
       type: "button",
       disabled,
       className: cn(
-        "ui-w-full ui-text-md ui-flex ui-items-center ui-justify-between ui-rounded-lg ui-bg-white ui-px-2 ui-py-2 ui-text-sm ui-text-left ui-transition-all ui-duration-200 ui-outline-none",
-        "focus:ui-ring-1 focus:ui-ring-primaryx-500 focus:ui-border-primaryx-500",
-        error ? "ui-border-red-500 ui-text-red-900" : "ui-border ui-border-gray-200 ui-text-gray-900",
-        disabled ? "ui-bg-gray-50 ui-cursor-not-allowed ui-opacity-60" : "ui-cursor-pointer",
-        isOpen && "ui-border-primaryx-500 ui-ring-1 ui-ring-primaryx-500",
+        "w-full text-md flex items-center justify-between rounded-lg bg-white px-2 py-2 text-sm text-left transition-all duration-200 outline-none",
+        "focus:ring-1 focus:ring-primaryx-500 focus:border-primaryx-500",
+        error ? "border-red-500 text-red-900" : "border border-gray-200 text-gray-900",
+        disabled ? "bg-gray-50 cursor-not-allowed opacity-60" : "cursor-pointer",
+        isOpen && "border-primaryx-500 ring-1 ring-primaryx-500",
         triggerClassName
       ),
       children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ui-flex ui-items-center ui-gap-2 ui-truncate", children: [
-          (selectedOption == null ? void 0 : selectedOption.icon) ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "ui-text-gray-500", children: selectedOption.icon }) : (selectedOption == null ? void 0 : selectedOption.src) ? /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: selectedOption.src, alt: selectedOption.label, className: "ui-w-4 ui-h-4" }) : null,
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("ui-truncate", !selectedOption && "ui-text-gray-400"), children: selectedOption ? selectedOption.label : placeholder })
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 truncate", children: [
+          (selectedOption == null ? void 0 : selectedOption.icon) ? /* @__PURE__ */ jsx("span", { className: "text-gray-500", children: selectedOption.icon }) : (selectedOption == null ? void 0 : selectedOption.src) ? /* @__PURE__ */ jsx("img", { src: selectedOption.src, alt: selectedOption.label, className: "w-4 h-4" }) : null,
+          /* @__PURE__ */ jsx("span", { className: cn("truncate", !selectedOption && "text-gray-400"), children: selectedOption ? selectedOption.label : placeholder })
         ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(ChevronDown, { className: cn("ui-h-4 ui-w-4 ui-text-gray-500 ui-transition-transform ui-duration-200", isOpen && "ui-rotate-180") })
+        /* @__PURE__ */ jsx(ChevronDown, { className: cn("h-4 w-4 text-gray-500 transition-transform duration-200", isOpen && "rotate-180") })
       ]
     }
   );
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: containerRef, className: cn("ui-relative ui-w-full", className), children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { onClick: toggleOpen, ref: triggerRef, className: "ui-w-full", children: triggerButton ? triggerButton({ isOpen }) : enableTooltip ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("relative w-full", className), children: [
+    /* @__PURE__ */ jsx("div", { onClick: toggleOpen, ref: triggerRef, className: "w-full", children: triggerButton ? triggerButton({ isOpen }) : enableTooltip ? /* @__PURE__ */ jsx(
       Tooltip,
       {
         placement: tooltipPlacement,
@@ -151,7 +149,7 @@ const CustomSelect = ({
       }
     ) : TriggerContent }),
     typeof document !== "undefined" && createPortal(
-      /* @__PURE__ */ jsxRuntimeExports.jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      /* @__PURE__ */ jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsxs(
         motion.div,
         {
           ref: popoverRef,
@@ -167,37 +165,37 @@ const CustomSelect = ({
             zIndex: 99999,
             transformOrigin: "top left"
           },
-          className: "ui-rounded-xl ui-bg-white ui-shadow-2xl ui-border ui-border-gray-200 hover:ui-border-primaryx-700 ui-flex ui-flex-col ui-p-1.5",
+          className: "rounded-xl bg-white shadow-2xl border border-gray-200 hover:border-primaryx-700 flex flex-col p-1.5",
           children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            /* @__PURE__ */ jsxs(
               "div",
               {
                 style: { maxHeight: coords.maxHeight },
-                className: "ui-w-full ui-overflow-y-auto ui-flex ui-flex-col ui-gap-0.5 ui-px-0.5",
+                className: "w-full overflow-y-auto flex flex-col gap-0.5 px-0.5",
                 children: [
-                  enableSearch && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-sticky ui-text-sm ui-w-full ui-top-0 ui-z-10 ui-bg-white ui-pb-4 ui-pt-1 ui-px-1", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  enableSearch && /* @__PURE__ */ jsx("div", { className: "sticky text-sm w-full top-0 z-10 bg-white pb-4 pt-1 px-1", children: /* @__PURE__ */ jsx(
                     FormInput,
                     {
                       type: "text",
                       value: searchQuery,
                       onChange: (e) => setSearchQuery(typeof e === "string" ? e : e.target.value),
                       placeholder,
-                      inputClassName: "ui-h-9"
+                      inputClassName: "h-9"
                     }
                   ) }),
                   filteredOptions.length > 0 ? filteredOptions.map((option) => {
                     if (option.isLabel) {
-                      return /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      return /* @__PURE__ */ jsx(
                         "div",
                         {
-                          className: "ui-text-sm ui-font-semibold ui-text-gray-400 ui-mt-2 ui-pl-2",
+                          className: "text-sm font-semibold text-gray-400 mt-2 pl-2",
                           children: option.label
                         },
                         option.value
                       );
                     }
                     const isSelected = multiple ? Array.isArray(value) && value.includes(option.value) : value === option.value;
-                    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+                    return /* @__PURE__ */ jsxs(
                       "div",
                       {
                         role: "button",
@@ -210,32 +208,32 @@ const CustomSelect = ({
                           }
                         },
                         className: cn(
-                          "ui-flex ui-items-center ui-justify-between ui-w-full ui-px-3 ui-py-2.5 ui-text-sm ui-rounded-lg ui-transition-all ui-duration-200 ui-text-gray-600 hover:ui-text-gray-900 ui-cursor-pointer",
-                          isSelected ? "ui-bg-gray-100" : "hover:ui-bg-gray-50"
+                          "flex items-center justify-between w-full px-3 py-2.5 text-sm rounded-lg transition-all duration-200 text-gray-600 hover:text-gray-900 cursor-pointer",
+                          isSelected ? "bg-gray-100" : "hover:bg-gray-50"
                         ),
                         children: [
-                          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "ui-flex ui-items-center ui-space-x-3 ui-text-left ui-pointer-events-none", children: [
-                            showCheckbox && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                          /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-3 text-left pointer-events-none", children: [
+                            showCheckbox && /* @__PURE__ */ jsx(
                               Checkbox,
                               {
                                 checked: isSelected,
                                 readOnly: true,
-                                className: "ui-mr-1"
+                                className: "mr-1"
                               }
                             ),
-                            option.icon ? /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn("ui-w-4 ui-h-4", isSelected ? "ui-text-primaryx-600" : "ui-text-gray-400"), children: option.icon }) : option.src ? /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: option.src, alt: option.label, className: "ui-w-4 ui-h-4" }) : null,
-                            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: option.label })
+                            option.icon ? /* @__PURE__ */ jsx("span", { className: cn("w-4 h-4", isSelected ? "text-primaryx-600" : "text-gray-400"), children: option.icon }) : option.src ? /* @__PURE__ */ jsx("img", { src: option.src, alt: option.label, className: "w-4 h-4" }) : null,
+                            /* @__PURE__ */ jsx("span", { children: option.label })
                           ] }),
-                          !showCheckbox && isSelected && /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "ui-h-4 ui-w-4 ui-text-primaryx-600" })
+                          !showCheckbox && isSelected && /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 text-primaryx-600" })
                         ]
                       },
                       option.value
                     );
-                  }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-min-h-20 ui-flex ui-justify-center ui-items-center ui-text-center ui-text-sm ui-text-gray-500 ui-py-4", children: "No results found" })
+                  }) : /* @__PURE__ */ jsx("div", { className: "min-h-20 flex justify-center items-center text-center text-sm text-gray-500 py-4", children: "No results found" })
                 ]
               }
             ),
-            onClear && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "ui-mt-2 ui-pt-2 ui-border-t ui-border-gray-100", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            onClear && /* @__PURE__ */ jsx("div", { className: "mt-2 pt-2 border-t border-gray-100", children: /* @__PURE__ */ jsx(
               "button",
               {
                 type: "button",
@@ -243,7 +241,7 @@ const CustomSelect = ({
                   onClear();
                   setIsOpen(false);
                 },
-                className: "ui-w-full ui-px-3 ui-py-2 ui-text-xs ui-font-semibold ui-text-center ui-text-red-500 hover:ui-text-red-600 hover:ui-bg-red-50 ui-rounded-lg ui-transition-colors ui-uppercase ui-tracking-wide",
+                className: "w-full px-3 py-2 text-xs font-semibold text-center text-red-500 hover:text-red-600 hover:bg-red-50 rounded-lg transition-colors uppercase tracking-wide",
                 children: "Clear Filters"
               }
             ) })

package/dist/components/CustomSelect/CustomSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomSelect.js","sources":["../../../src/components/CustomSelect/CustomSelect.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, memo, ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ChevronDown, Check } from \"lucide-react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { cn } from \"../../utils/cn\";\nimport FormInput from \"../FormInput/FormInput\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Checkbox } from \"../Checkbox/Checkbox\";\n\nexport interface CustomSelectOption {\n label: string;\n value: string;\n icon?: React.ReactNode;\n src?: string;\n isLabel?: boolean;\n}\n\ninterface CustomSelectProps {\n value?: string \| string[];\n onChange: (value: any) => void;\n options: CustomSelectOption[];\n placeholder?: string;\n disabled?: boolean;\n className?: string;\n triggerClassName?: string;\n error?: string;\n enableSearch?: boolean;\n multiple?: boolean;\n triggerButton?: ({ isOpen }: { isOpen?: boolean; }) => React.ReactNode;\n onClear?: () => void;\n showCheckbox?: boolean;\n tooltipContent?: ReactNode;\n enableTooltip?: boolean;\n tooltipPlacement?: \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n tooltipTriggerClassName?: string;\n}\n\nconst CustomSelect = ({\n value,\n onChange,\n options,\n placeholder = \"Select...\",\n disabled = false,\n className,\n error,\n enableSearch = false,\n multiple = false,\n triggerButton,\n onClear,\n showCheckbox = false,\n triggerClassName,\n tooltipContent,\n enableTooltip = false,\n tooltipPlacement = \"top\",\n tooltipTriggerClassName\n}: CustomSelectProps) => {\n const [isOpen, setIsOpen] = useState(false);\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [coords, setCoords] = useState<{ top: number; left: number; width: number; maxHeight: number }>({ top: 0, left: 0, width: 0, maxHeight: 300 });\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n const selectedOption = !multiple ? options.find((opt) => opt.value === value) : null;\n\n const filteredOptions = enableSearch\n ? options.filter((opt) => opt.label.toLowerCase().includes(searchQuery.toLowerCase()))\n : options;\n\n useEffect(() => {\n if (isOpen && enableSearch) {\n setSearchQuery(\"\");\n }\n }, [isOpen, enableSearch]);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n const target = event.target as Node;\n if (\n containerRef.current &&\n !containerRef.current.contains(target) &&\n popoverRef.current &&\n !popoverRef.current.contains(target)\n ) {\n setIsOpen(false);\n }\n };\n\n if (isOpen) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n window.addEventListener(\"scroll\", updatePosition, true);\n window.addEventListener(\"resize\", updatePosition);\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n window.removeEventListener(\"scroll\", updatePosition, true);\n window.removeEventListener(\"resize\", updatePosition);\n };\n }, [isOpen]);\n\n const updatePosition = () => {\n if (triggerRef.current) {\n const rect = triggerRef.current.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const buffer = 8;\n\n const spaceBelow = viewportHeight - rect.bottom - buffer - 16;\n const spaceAbove = rect.top - buffer - 16;\n\n let topPosition: number;\n let maxHeightValue: number;\n\n if (spaceBelow >= 200 \|\| spaceBelow > spaceAbove) {\n topPosition = rect.bottom + buffer;\n maxHeightValue = Math.min(spaceBelow, 400);\n } else {\n topPosition = rect.bottom + buffer;\n maxHeightValue = Math.min(spaceBelow, 400);\n }\n\n setCoords({\n top: topPosition,\n left: rect.left,\n width: rect.width,\n maxHeight: Math.max(100, maxHeightValue)\n });\n }\n };\n\n useEffect(() => {\n if (isOpen) {\n updatePosition();\n const handleScroll = () => {\n if (isOpen) updatePosition();\n };\n window.addEventListener(\"scroll\", handleScroll, true);\n window.addEventListener(\"resize\", handleScroll);\n return () => {\n window.removeEventListener(\"scroll\", handleScroll, true);\n window.removeEventListener(\"resize\", handleScroll);\n };\n }\n }, [isOpen]);\n\n const toggleOpen = () => {\n if (!disabled) {\n if (!isOpen) updatePosition();\n setIsOpen(!isOpen);\n }\n };\n\n const handleSelect = (val: string) => {\n if (multiple) {\n const currentValues = Array.isArray(value) ? value : [];\n const isSelected = currentValues.includes(val);\n let newValues;\n if (isSelected) {\n newValues = currentValues.filter(v => v !== val);\n } else {\n newValues = [...currentValues, val];\n }\n onChange(newValues);\n } else {\n onChange(val);\n setIsOpen(false);\n }\n };\n\n const TriggerContent = (\n <button\n type=\"button\"\n disabled={disabled}\n className={cn(\n \"ui-w-full ui-text-md ui-flex ui-items-center ui-justify-between ui-rounded-lg ui-bg-white ui-px-2 ui-py-2 ui-text-sm ui-text-left ui-transition-all ui-duration-200 ui-outline-none\",\n \"focus:ui-ring-1 focus:ui-ring-primaryx-500 focus:ui-border-primaryx-500\",\n error ? \"ui-border-red-500 ui-text-red-900\" : \"ui-border ui-border-gray-200 ui-text-gray-900\",\n disabled ? \"ui-bg-gray-50 ui-cursor-not-allowed ui-opacity-60\" : \"ui-cursor-pointer\",\n isOpen && \"ui-border-primaryx-500 ui-ring-1 ui-ring-primaryx-500\",\n triggerClassName\n )}\n >\n <div className=\"ui-flex ui-items-center ui-gap-2 ui-truncate\">\n {selectedOption?.icon ? (\n <span className=\"ui-text-gray-500\">{selectedOption.icon}</span>\n ) : selectedOption?.src ? (\n <img src={selectedOption.src} alt={selectedOption.label} className=\"ui-w-4 ui-h-4\" />\n ) : null}\n <span className={cn(\"ui-truncate\", !selectedOption && \"ui-text-gray-400\")}>\n {selectedOption ? selectedOption.label : placeholder}\n </span>\n </div>\n <ChevronDown className={cn(\"ui-h-4 ui-w-4 ui-text-gray-500 ui-transition-transform ui-duration-200\", isOpen && \"ui-rotate-180\")} />\n </button>\n );\n\n return (\n <div ref={containerRef} className={cn(\"ui-relative ui-w-full\", className)}>\n <div onClick={toggleOpen} ref={triggerRef as any} className=\"ui-w-full\">\n {triggerButton ? (\n triggerButton({ isOpen })\n ) : (\n enableTooltip ? (\n <Tooltip\n placement={tooltipPlacement}\n content={tooltipContent}\n >\n {TriggerContent}\n </Tooltip>\n ) : (\n TriggerContent\n )\n )}\n </div>\n\n {typeof document !== \"undefined\" && createPortal(\n <AnimatePresence>\n {isOpen && (\n <motion.div\n ref={popoverRef}\n initial={{ opacity: 0, y: -10, scale: 0.98 }}\n animate={{ opacity: 1, y: 0, scale: 1 }}\n exit={{ opacity: 0, y: -10, scale: 0.98 }}\n transition={{ duration: 0.15, ease: \"easeOut\" }}\n style={{\n position: \"fixed\",\n top: coords.top,\n left: coords.left,\n width: Math.max(coords.width, 220),\n zIndex: 99999,\n transformOrigin: 'top left'\n }}\n className=\"ui-rounded-xl ui-bg-white ui-shadow-2xl ui-border ui-border-gray-200 hover:ui-border-primaryx-700 ui-flex ui-flex-col ui-p-1.5\"\n >\n <div\n style={{ maxHeight: coords.maxHeight }}\n className=\"ui-w-full ui-overflow-y-auto ui-flex ui-flex-col ui-gap-0.5 ui-px-0.5\"\n >\n {enableSearch && (\n <div className=\"ui-sticky ui-text-sm ui-w-full ui-top-0 ui-z-10 ui-bg-white ui-pb-4 ui-pt-1 ui-px-1\">\n <FormInput\n type=\"text\"\n value={searchQuery}\n onChange={(e: any) => setSearchQuery(typeof e === 'string' ? e : e.target.value)}\n placeholder={placeholder}\n inputClassName=\"ui-h-9\"\n />\n </div>\n )}\n {filteredOptions.length > 0 ? (\n filteredOptions.map((option) => {\n if (option.isLabel) {\n return (\n <div\n key={option.value}\n className=\"ui-text-sm ui-font-semibold ui-text-gray-400 ui-mt-2 ui-pl-2\"\n >\n {option.label}\n </div>\n );\n }\n\n const isSelected = multiple\n ? (Array.isArray(value) && value.includes(option.value))\n : value === option.value;\n\n return (\n <div\n key={option.value}\n role=\"button\"\n tabIndex={0}\n onClick={() => handleSelect(option.value)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n handleSelect(option.value);\n }\n }}\n className={cn(\n \"ui-flex ui-items-center ui-justify-between ui-w-full ui-px-3 ui-py-2.5 ui-text-sm ui-rounded-lg ui-transition-all ui-duration-200 ui-text-gray-600 hover:ui-text-gray-900 ui-cursor-pointer\",\n isSelected ? \"ui-bg-gray-100\" : \"hover:ui-bg-gray-50\"\n )}\n >\n <div className=\"ui-flex ui-items-center ui-space-x-3 ui-text-left ui-pointer-events-none\">\n {showCheckbox && (\n <Checkbox\n checked={isSelected}\n readOnly\n className=\"ui-mr-1\"\n />\n )}\n {option.icon ? (\n <span className={cn(\"ui-w-4 ui-h-4\", isSelected ? \"ui-text-primaryx-600\" : \"ui-text-gray-400\")}>\n {option.icon}\n </span>\n ) : option.src ? (\n <img src={option.src} alt={option.label} className=\"ui-w-4 ui-h-4\" />\n ) : null}\n <span>{option.label}</span>\n </div>\n {!showCheckbox && isSelected && <Check className=\"ui-h-4 ui-w-4 ui-text-primaryx-600\" />}\n </div>\n );\n })\n ) : (\n <div className=\"ui-min-h-20 ui-flex ui-justify-center ui-items-center ui-text-center ui-text-sm ui-text-gray-500 ui-py-4\">No results found</div>\n )}\n </div>\n\n {onClear && (\n <div className=\"ui-mt-2 ui-pt-2 ui-border-t ui-border-gray-100\">\n <button\n type=\"button\"\n onClick={() => {\n onClear();\n setIsOpen(false);\n }}\n className=\"ui-w-full ui-px-3 ui-py-2 ui-text-xs ui-font-semibold ui-text-center ui-text-red-500 hover:ui-text-red-600 hover:ui-bg-red-50 ui-rounded-lg ui-transition-colors ui-uppercase ui-tracking-wide\"\n >\n Clear Filters\n </button>\n </div>\n )}\n </motion.div>\n )}\n </AnimatePresence>,\n document.body\n )}\n </div>\n );\n};\n\nexport default memo(CustomSelect);\n"],"names":["jsxs","jsx"],"mappings":"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"}
1	+ {"version":3,"file":"CustomSelect.js","sources":["../../../src/components/CustomSelect/CustomSelect.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, memo, ReactNode } from \"react\";\r\nimport { createPortal } from \"react-dom\";\r\nimport { ChevronDown, Check } from \"lucide-react\";\r\nimport { AnimatePresence, motion } from \"framer-motion\";\r\nimport { cn } from \"../../utils/cn\";\r\nimport FormInput from \"../FormInput/FormInput\";\r\nimport { Tooltip } from \"../Tooltip/Tooltip\";\r\nimport { Checkbox } from \"../Checkbox/Checkbox\";\r\n\r\nexport interface CustomSelectOption {\r\n label: string;\r\n value: string;\r\n icon?: React.ReactNode;\r\n src?: string;\r\n isLabel?: boolean;\r\n}\r\n\r\ninterface CustomSelectProps {\r\n value?: string \| string[];\r\n onChange: (value: any) => void;\r\n options: CustomSelectOption[];\r\n placeholder?: string;\r\n disabled?: boolean;\r\n className?: string;\r\n triggerClassName?: string;\r\n error?: string;\r\n enableSearch?: boolean;\r\n multiple?: boolean;\r\n triggerButton?: ({ isOpen }: { isOpen?: boolean; }) => React.ReactNode;\r\n onClear?: () => void;\r\n showCheckbox?: boolean;\r\n tooltipContent?: ReactNode;\r\n enableTooltip?: boolean;\r\n tooltipPlacement?: \"top\" \| \"bottom\" \| \"left\" \| \"right\";\r\n tooltipTriggerClassName?: string;\r\n}\r\n\r\nconst CustomSelect = ({\r\n value,\r\n onChange,\r\n options,\r\n placeholder = \"Select...\",\r\n disabled = false,\r\n className,\r\n error,\r\n enableSearch = false,\r\n multiple = false,\r\n triggerButton,\r\n onClear,\r\n showCheckbox = false,\r\n triggerClassName,\r\n tooltipContent,\r\n enableTooltip = false,\r\n tooltipPlacement = \"top\",\r\n tooltipTriggerClassName\r\n}: CustomSelectProps) => {\r\n const [isOpen, setIsOpen] = useState(false);\r\n const [searchQuery, setSearchQuery] = useState(\"\");\r\n const [coords, setCoords] = useState<{ top: number; left: number; width: number; maxHeight: number }>({ top: 0, left: 0, width: 0, maxHeight: 300 });\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n const triggerRef = useRef<HTMLElement>(null);\r\n const popoverRef = useRef<HTMLDivElement>(null);\r\n\r\n const selectedOption = !multiple ? options.find((opt) => opt.value === value) : null;\r\n\r\n const filteredOptions = enableSearch\r\n ? options.filter((opt) => opt.label.toLowerCase().includes(searchQuery.toLowerCase()))\r\n : options;\r\n\r\n useEffect(() => {\r\n if (isOpen && enableSearch) {\r\n setSearchQuery(\"\");\r\n }\r\n }, [isOpen, enableSearch]);\r\n\r\n useEffect(() => {\r\n const handleClickOutside = (event: MouseEvent) => {\r\n const target = event.target as Node;\r\n if (\r\n containerRef.current &&\r\n !containerRef.current.contains(target) &&\r\n popoverRef.current &&\r\n !popoverRef.current.contains(target)\r\n ) {\r\n setIsOpen(false);\r\n }\r\n };\r\n\r\n if (isOpen) {\r\n document.addEventListener(\"mousedown\", handleClickOutside);\r\n window.addEventListener(\"scroll\", updatePosition, true);\r\n window.addEventListener(\"resize\", updatePosition);\r\n }\r\n\r\n return () => {\r\n document.removeEventListener(\"mousedown\", handleClickOutside);\r\n window.removeEventListener(\"scroll\", updatePosition, true);\r\n window.removeEventListener(\"resize\", updatePosition);\r\n };\r\n }, [isOpen]);\r\n\r\n const updatePosition = () => {\r\n if (triggerRef.current) {\r\n const rect = triggerRef.current.getBoundingClientRect();\r\n const viewportHeight = window.innerHeight;\r\n const buffer = 8;\r\n\r\n const spaceBelow = viewportHeight - rect.bottom - buffer - 16;\r\n const spaceAbove = rect.top - buffer - 16;\r\n\r\n let topPosition: number;\r\n let maxHeightValue: number;\r\n\r\n if (spaceBelow >= 200 \|\| spaceBelow > spaceAbove) {\r\n topPosition = rect.bottom + buffer;\r\n maxHeightValue = Math.min(spaceBelow, 400);\r\n } else {\r\n topPosition = rect.bottom + buffer;\r\n maxHeightValue = Math.min(spaceBelow, 400);\r\n }\r\n\r\n setCoords({\r\n top: topPosition,\r\n left: rect.left,\r\n width: rect.width,\r\n maxHeight: Math.max(100, maxHeightValue)\r\n });\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (isOpen) {\r\n updatePosition();\r\n const handleScroll = () => {\r\n if (isOpen) updatePosition();\r\n };\r\n window.addEventListener(\"scroll\", handleScroll, true);\r\n window.addEventListener(\"resize\", handleScroll);\r\n return () => {\r\n window.removeEventListener(\"scroll\", handleScroll, true);\r\n window.removeEventListener(\"resize\", handleScroll);\r\n };\r\n }\r\n }, [isOpen]);\r\n\r\n const toggleOpen = () => {\r\n if (!disabled) {\r\n if (!isOpen) updatePosition();\r\n setIsOpen(!isOpen);\r\n }\r\n };\r\n\r\n const handleSelect = (val: string) => {\r\n if (multiple) {\r\n const currentValues = Array.isArray(value) ? value : [];\r\n const isSelected = currentValues.includes(val);\r\n let newValues;\r\n if (isSelected) {\r\n newValues = currentValues.filter(v => v !== val);\r\n } else {\r\n newValues = [...currentValues, val];\r\n }\r\n onChange(newValues);\r\n } else {\r\n onChange(val);\r\n setIsOpen(false);\r\n }\r\n };\r\n\r\n const TriggerContent = (\r\n <button\r\n type=\"button\"\r\n disabled={disabled}\r\n className={cn(\r\n \"w-full text-md flex items-center justify-between rounded-lg bg-white px-2 py-2 text-sm text-left transition-all duration-200 outline-none\",\r\n \"focus:ring-1 focus:ring-primaryx-500 focus:border-primaryx-500\",\r\n error ? \"border-red-500 text-red-900\" : \"border border-gray-200 text-gray-900\",\r\n disabled ? \"bg-gray-50 cursor-not-allowed opacity-60\" : \"cursor-pointer\",\r\n isOpen && \"border-primaryx-500 ring-1 ring-primaryx-500\",\r\n triggerClassName\r\n )}\r\n >\r\n <div className=\"flex items-center gap-2 truncate\">\r\n {selectedOption?.icon ? (\r\n <span className=\"text-gray-500\">{selectedOption.icon}</span>\r\n ) : selectedOption?.src ? (\r\n <img src={selectedOption.src} alt={selectedOption.label} className=\"w-4 h-4\" />\r\n ) : null}\r\n <span className={cn(\"truncate\", !selectedOption && \"text-gray-400\")}>\r\n {selectedOption ? selectedOption.label : placeholder}\r\n </span>\r\n </div>\r\n <ChevronDown className={cn(\"h-4 w-4 text-gray-500 transition-transform duration-200\", isOpen && \"rotate-180\")} />\r\n </button>\r\n );\r\n\r\n return (\r\n <div ref={containerRef} className={cn(\"relative w-full\", className)}>\r\n <div onClick={toggleOpen} ref={triggerRef as any} className=\"w-full\">\r\n {triggerButton ? (\r\n triggerButton({ isOpen })\r\n ) : (\r\n enableTooltip ? (\r\n <Tooltip\r\n placement={tooltipPlacement}\r\n content={tooltipContent}\r\n >\r\n {TriggerContent}\r\n </Tooltip>\r\n ) : (\r\n TriggerContent\r\n )\r\n )}\r\n </div>\r\n\r\n {typeof document !== \"undefined\" && createPortal(\r\n <AnimatePresence>\r\n {isOpen && (\r\n <motion.div\r\n ref={popoverRef}\r\n initial={{ opacity: 0, y: -10, scale: 0.98 }}\r\n animate={{ opacity: 1, y: 0, scale: 1 }}\r\n exit={{ opacity: 0, y: -10, scale: 0.98 }}\r\n transition={{ duration: 0.15, ease: \"easeOut\" }}\r\n style={{\r\n position: \"fixed\",\r\n top: coords.top,\r\n left: coords.left,\r\n width: Math.max(coords.width, 220),\r\n zIndex: 99999,\r\n transformOrigin: 'top left'\r\n }}\r\n className=\"rounded-xl bg-white shadow-2xl border border-gray-200 hover:border-primaryx-700 flex flex-col p-1.5\"\r\n >\r\n <div\r\n style={{ maxHeight: coords.maxHeight }}\r\n className=\"w-full overflow-y-auto flex flex-col gap-0.5 px-0.5\"\r\n >\r\n {enableSearch && (\r\n <div className=\"sticky text-sm w-full top-0 z-10 bg-white pb-4 pt-1 px-1\">\r\n <FormInput\r\n type=\"text\"\r\n value={searchQuery}\r\n onChange={(e: any) => setSearchQuery(typeof e === 'string' ? e : e.target.value)}\r\n placeholder={placeholder}\r\n inputClassName=\"h-9\"\r\n />\r\n </div>\r\n )}\r\n {filteredOptions.length > 0 ? (\r\n filteredOptions.map((option) => {\r\n if (option.isLabel) {\r\n return (\r\n <div\r\n key={option.value}\r\n className=\"text-sm font-semibold text-gray-400 mt-2 pl-2\"\r\n >\r\n {option.label}\r\n </div>\r\n );\r\n }\r\n\r\n const isSelected = multiple\r\n ? (Array.isArray(value) && value.includes(option.value))\r\n : value === option.value;\r\n\r\n return (\r\n <div\r\n key={option.value}\r\n role=\"button\"\r\n tabIndex={0}\r\n onClick={() => handleSelect(option.value)}\r\n onKeyDown={(e) => {\r\n if (e.key === 'Enter' \|\| e.key === ' ') {\r\n e.preventDefault();\r\n handleSelect(option.value);\r\n }\r\n }}\r\n className={cn(\r\n \"flex items-center justify-between w-full px-3 py-2.5 text-sm rounded-lg transition-all duration-200 text-gray-600 hover:text-gray-900 cursor-pointer\",\r\n isSelected ? \"bg-gray-100\" : \"hover:bg-gray-50\"\r\n )}\r\n >\r\n <div className=\"flex items-center space-x-3 text-left pointer-events-none\">\r\n {showCheckbox && (\r\n <Checkbox\r\n checked={isSelected}\r\n readOnly\r\n className=\"mr-1\"\r\n />\r\n )}\r\n {option.icon ? (\r\n <span className={cn(\"w-4 h-4\", isSelected ? \"text-primaryx-600\" : \"text-gray-400\")}>\r\n {option.icon}\r\n </span>\r\n ) : option.src ? (\r\n <img src={option.src} alt={option.label} className=\"w-4 h-4\" />\r\n ) : null}\r\n <span>{option.label}</span>\r\n </div>\r\n {!showCheckbox && isSelected && <Check className=\"h-4 w-4 text-primaryx-600\" />}\r\n </div>\r\n );\r\n })\r\n ) : (\r\n <div className=\"min-h-20 flex justify-center items-center text-center text-sm text-gray-500 py-4\">No results found</div>\r\n )}\r\n </div>\r\n\r\n {onClear && (\r\n <div className=\"mt-2 pt-2 border-t border-gray-100\">\r\n <button\r\n type=\"button\"\r\n onClick={() => {\r\n onClear();\r\n setIsOpen(false);\r\n }}\r\n className=\"w-full px-3 py-2 text-xs font-semibold text-center text-red-500 hover:text-red-600 hover:bg-red-50 rounded-lg transition-colors uppercase tracking-wide\"\r\n >\r\n Clear Filters\r\n </button>\r\n </div>\r\n )}\r\n </motion.div>\r\n )}\r\n </AnimatePresence>,\r\n document.body\r\n )}\r\n </div>\r\n );\r\n};\r\n\r\nexport default memo(CustomSelect);\r\n"],"names":[],"mappings":"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"}

package/dist/components/EventAddForm/AddEventLayout.d.ts ADDED Viewed

@@ -0,0 +1,58 @@
+import { default as React } from 'react';
+interface AddEventLayoutProps {
+    steps: {
+        id: number;
+        title: string;
+    }[];
+    currentStep: number;
+    maxStepReached: number;
+    isNavigationBlocked: boolean;
+    onJumpToStep: (id: number) => void;
+    children: React.ReactNode;
+    onBack: () => void;
+    onNext: () => void;
+    onSaveDraft: () => void;
+    isProcessing: boolean;
+    isSubmitting: boolean;
+    isSyncingData?: boolean;
+    isNavigating?: boolean;
+    isChildBusy?: boolean;
+    edit?: boolean;
+    isFetchError: boolean;
+    isFetching: boolean;
+    onRetryFetch: () => void;
+    alert: {
+        show: boolean;
+        message: string;
+        type: 'success' | 'error';
+    };
+    onCloseAlert: () => void;
+    submissionModalProps: {
+        open: boolean;
+        setOpen: (open: boolean) => void;
+        onSubmit: () => Promise<string>;
+        onSuccess: (type: "submit" | "draft" | "next") => void;
+        isFinalStep?: boolean;
+        showPreview?: boolean;
+        isPolluted?: boolean;
+    };
+    switchConfirmationModalProps: {
+        open: boolean;
+        onClose: () => void;
+        onConfirm: () => void;
+        title: string;
+        description: string;
+    };
+    eventId?: string | null;
+    onRouteBack: () => void;
+    exitConfirmationModalProps: {
+        open: boolean;
+        onClose: () => void;
+        onConfirm: () => void;
+    };
+    eventData?: any;
+    mode?: "questions" | "social" | null;
+}
+export declare const AddEventLayout: ({ steps, currentStep, maxStepReached, isNavigationBlocked, onJumpToStep, children, onBack, onNext, onSaveDraft, isProcessing, isSubmitting, isSyncingData, isNavigating, isChildBusy, edit, isFetchError, isFetching, onRetryFetch, alert, onCloseAlert, submissionModalProps, switchConfirmationModalProps, eventId, onRouteBack, exitConfirmationModalProps, eventData, mode, }: AddEventLayoutProps) => import("react/jsx-runtime").JSX.Element;
+export {};