@123usmanhaider321/ui 0.1.8 → 1.0.2

package/dist/components/CheckboxGroup/CheckboxGroup.js

@@ -1,99 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import InformationPopover from "../InformationPopover/InformationPopover.js";
-import { Checkbox } from "../Checkbox/Checkbox.js";
-import InputErrorMessage from "../InputErrorMessage/InputErrorMessage.js";
-import { Radio } from "../Radio/Radio.js";
-import { cn } from "../../utils/cn.js";
-const CheckboxGroup = ({
-  label,
-  options,
-  formData,
-  setFormData,
-  field,
-  classname,
-  formErrors,
-  validation,
-  tooltip,
-  inputType = "checkbox",
-  filled = true
-}) => {
-  const handleChanges = (value) => {
-    const currentValues = formData[field] || [];
-    let newValues;
-    if (inputType === "radio") {
-      newValues = [value];
-    } else {
-      if (currentValues.includes(value)) {
-        newValues = currentValues.filter((item) => item !== value);
-      } else {
-        newValues = [...currentValues, value];
-      }
-    }
-    setFormData((prev) => ({
-      ...prev,
-      [field]: newValues
-    }));
-    if (validation) {
-      validation();
-    }
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "transition-all duration-300 ease-in-out", children: [
-    /* @__PURE__ */ jsx("div", { className: "flex justify-between items-center mb-3", children: /* @__PURE__ */ jsxs("div", { className: "w-full flex items-center gap-x-2", children: [
-      /* @__PURE__ */ jsxs("label", { className: "block text-sm text-gray-700 font-medium whitespace-nowrap", children: [
-        label,
-        " ",
-        /* @__PURE__ */ jsx("span", { className: "text-red-500", children: "*" })
-      ] }),
-      tooltip && /* @__PURE__ */ jsx(InformationPopover, { text: tooltip })
-    ] }) }),
-    /* @__PURE__ */ jsx("div", { className: cn(
-      "grid grid-cols-1 gap-3",
-      classname
-    ), children: options.map((option, index) => {
-      var _a, _b;
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          title: (option == null ? void 0 : option.title) || void 0,
-          className: option.disabled ? "cursor-not-allowed opacity-60" : "group",
-          children: /* @__PURE__ */ jsxs("label", { className: "relative flex items-center cursor-pointer select-none pr-5 space-x-2", children: [
-            inputType === "radio" ? /* @__PURE__ */ jsx(
-              Radio,
-              {
-                name: field,
-                value: option.value,
-                checked: (_a = formData[field]) == null ? void 0 : _a.includes(option.value),
-                onChange: () => handleChanges(option.value),
-                disabled: option.disabled,
-                className: "mr-3"
-              }
-            ) : /* @__PURE__ */ jsx(
-              Checkbox,
-              {
-                checked: (_b = formData[field]) == null ? void 0 : _b.includes(option.value),
-                onCheckedChange: () => handleChanges(option.value),
-                disabled: option.disabled,
-                className: "mr-3",
-                filled
-              }
-            ),
-            /* @__PURE__ */ jsxs("div", { className: "relative flex gap-2", children: [
-              /* @__PURE__ */ jsx("span", { className: cn(
-                "text-sm transition-colors duration-200",
-                option.disabled ? "text-gray-400" : "text-gray-700 hover:text-gray-900"
-              ), children: (option == null ? void 0 : option.label) || option.value }),
-              option.description && /* @__PURE__ */ jsx(InformationPopover, { text: option.description, className: option.disabled ? "text-gray-400" : "text-gray-900" }),
-              option.tooltip && /* @__PURE__ */ jsx(InformationPopover, { text: option.tooltip, className: option.disabled ? "text-gray-400" : "text-gray-900" })
-            ] })
-          ] })
-        },
-        index
-      );
-    }) }),
-    /* @__PURE__ */ jsx(InputErrorMessage, { error: (formErrors == null ? void 0 : formErrors[field]) || "", className: "mt-2" })
-  ] });
-};
-export {
-  CheckboxGroup
-};
-//# sourceMappingURL=CheckboxGroup.js.map

package/dist/components/CheckboxGroup/CheckboxGroup.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CheckboxGroup.js","sources":["../../../src/components/CheckboxGroup/CheckboxGroup.tsx"],"sourcesContent":["import React from 'react';\r\nimport InformationPopover from \"../InformationPopover/InformationPopover\";\r\nimport { Checkbox } from \"../Checkbox/Checkbox\";\r\nimport InputErrorMessage from \"../InputErrorMessage/InputErrorMessage\";\r\nimport { Radio } from \"../Radio/Radio\";\r\nimport { cn } from \"../../utils/cn\";\r\n\r\ninterface CheckboxGroupProps {\r\n    label: string;\r\n    options: { value: string, label?: string; disabled: boolean, title?: string, description?: string; tooltip?: string; }[];\r\n    formData: any;\r\n    setFormData: any;\r\n    field: string;\r\n    classname?: string;\r\n    description?: string;\r\n    formErrors?: any;\r\n    validation?: any;\r\n    tooltip?: string;\r\n    inputType?: 'checkbox' | 'radio';\r\n    filled?: boolean;\r\n}\r\n\r\nexport const CheckboxGroup: React.FC<CheckboxGroupProps> = ({\r\n    label,\r\n    options,\r\n    formData,\r\n    setFormData,\r\n    field,\r\n    classname,\r\n    formErrors,\r\n    validation,\r\n    tooltip,\r\n    inputType = 'checkbox',\r\n    filled = true,\r\n}) => {\r\n\r\n    const handleChanges = (value: string) => {\r\n        const currentValues = formData[field] || [];\r\n        let newValues: any;\r\n\r\n        if (inputType === 'radio') {\r\n            newValues = [value];\r\n        } else {\r\n            if (currentValues.includes(value)) {\r\n                newValues = currentValues.filter((item: string) => item !== value);\r\n            } else {\r\n                newValues = [...currentValues, value];\r\n            }\r\n        }\r\n\r\n        setFormData((prev: any) => ({\r\n            ...prev,\r\n            [field]: newValues\r\n        }));\r\n\r\n        if (validation) {\r\n            validation();\r\n        }\r\n    };\r\n\r\n    return (\r\n        <div className=\"transition-all duration-300 ease-in-out\">\r\n            <div className=\"flex justify-between items-center mb-3\">\r\n                <div className=\"w-full flex items-center gap-x-2\">\r\n                    <label className=\"block text-sm text-gray-700 font-medium whitespace-nowrap\">\r\n                        {label} <span className=\"text-red-500\">*</span>\r\n                    </label>\r\n                    {tooltip && <InformationPopover text={tooltip} />}\r\n                </div>\r\n            </div>\r\n\r\n            <div className={cn(\r\n                \"grid grid-cols-1 gap-3\",\r\n                classname\r\n            )}>\r\n                {options.map((option, index) => (\r\n                    <div\r\n                        key={index}\r\n                        title={option?.title || undefined}\r\n                        className={option.disabled ? \"cursor-not-allowed opacity-60\" : \"group\"}\r\n                    >\r\n                        <label className=\"relative flex items-center cursor-pointer select-none pr-5 space-x-2\">\r\n                            {inputType === 'radio' ? (\r\n                                <Radio\r\n                                    name={field}\r\n                                    value={option.value}\r\n                                    checked={formData[field]?.includes(option.value)}\r\n                                    onChange={() => handleChanges(option.value)}\r\n                                    disabled={option.disabled}\r\n                                    className=\"mr-3\"\r\n                                />\r\n                            ) : (\r\n                                <Checkbox\r\n                                    checked={formData[field]?.includes(option.value)}\r\n                                    onCheckedChange={() => handleChanges(option.value)}\r\n                                    disabled={option.disabled}\r\n                                    className=\"mr-3\"\r\n                                    filled={filled}\r\n                                />\r\n                            )}\r\n                            <div className=\"relative flex gap-2\">\r\n                                <span className={cn(\r\n                                    \"text-sm transition-colors duration-200\",\r\n                                    option.disabled ? \"text-gray-400\" : \"text-gray-700 hover:text-gray-900\"\r\n                                )}>\r\n                                    {option?.label || option.value}\r\n                                </span>\r\n                                {option.description && <InformationPopover text={option.description} className={option.disabled ? \"text-gray-400\" : \"text-gray-900\"} />}\r\n                                {option.tooltip && <InformationPopover text={option.tooltip} className={option.disabled ? \"text-gray-400\" : \"text-gray-900\"} />}\r\n                            </div>\r\n                        </label>\r\n                    </div>\r\n                ))}\r\n            </div>\r\n            <InputErrorMessage error={formErrors?.[field] || \"\"} className=\"mt-2\" />\r\n        </div>\r\n    );\r\n};\r\n"],"names":[],"mappings":"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"}

package/dist/components/ConfirmationModal/ConfirmationModal.d.ts

@@ -1,15 +0,0 @@
-import { ReactNode } from 'react';
-
-export interface ConfirmationModalProps {
-    open: boolean;
-    title: string;
-    description?: string;
-    onClose: () => void;
-    onConfirm: () => Promise<void> | void;
-    confirmText?: string;
-    cancelText?: string;
-    children?: ReactNode;
-    isLoading?: boolean;
-    confirmationKeyword?: string;
-}
-export default function ConfirmationModal({ open, title, description, onClose, onConfirm, confirmText, cancelText, children, isLoading, confirmationKeyword }: ConfirmationModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ConfirmationModal/ConfirmationModal.js

@@ -1,136 +0,0 @@
-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 "react-icons/fa";
-import Modal from "../Modal/Modal.js";
-import { Button } from "../Button/Button.js";
-function ConfirmationModal({
-  open,
-  title,
-  description,
-  onClose,
-  onConfirm,
-  confirmText = "Confirm",
-  cancelText = "Cancel",
-  children,
-  isLoading,
-  confirmationKeyword
-}) {
-  const [internalLoading, setInternalLoading] = useState(false);
-  const [confirmInput, setConfirmInput] = useState("");
-  const loading = isLoading ?? internalLoading;
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (!loading) {
-      if (confirmationKeyword && confirmInput !== confirmationKeyword) {
-        return;
-      }
-      try {
-        setInternalLoading(true);
-        await onConfirm();
-      } finally {
-        setInternalLoading(false);
-      }
-    }
-  };
-  const handleClose = () => {
-    if (!loading) {
-      onClose();
-      setConfirmInput("");
-    }
-  };
-  const isSubmitDisabled = loading || (confirmationKeyword ? confirmInput !== confirmationKeyword : false);
-  return /* @__PURE__ */ jsx(
-    Modal,
-    {
-      open,
-      handleClose,
-      closeOnEscape: false,
-      closeOnOutsideClick: false,
-      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: "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__ */ jsxs(
-                "button",
-                {
-                  type: "button",
-                  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__ */ jsx("span", { className: "sr-only", children: "Close" }),
-                    /* @__PURE__ */ jsx(X, { height: 20, width: 20 })
-                  ]
-                }
-              )
-            ] }) }) }),
-            /* @__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__ */ jsx("span", { className: "font-bold select-all", children: confirmationKeyword }),
-                  " to confirm"
-                ] }),
-                /* @__PURE__ */ jsx(
-                  "input",
-                  {
-                    type: "text",
-                    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),
-                    onPaste: (e) => e.preventDefault(),
-                    autoComplete: "off"
-                  }
-                )
-              ] })
-            ] }),
-            /* @__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: "flex-1 h-11",
-                  onClick: handleClose,
-                  disabled: loading,
-                  children: cancelText
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  type: "submit",
-                  className: "flex-1 h-11",
-                  disabled: isSubmitDisabled,
-                  children: loading ? /* @__PURE__ */ jsx(FaCircleNotch, { size: 18, className: "animate-spin" }) : confirmText
-                }
-              )
-            ] })
-          ] })
-        }
-      ) }) })
-    }
-  );
-}
-export {
-  ConfirmationModal as default
-};
-//# sourceMappingURL=ConfirmationModal.js.map

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

@@ -1 +0,0 @@
-{"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/ConfirmationModal/index.d.ts

@@ -1,2 +0,0 @@
-export { default as ConfirmationModal } from './ConfirmationModal';
-export type { ConfirmationModalProps } from './ConfirmationModal';

package/dist/components/CustomSelect/CustomSelect.js

@@ -1,259 +0,0 @@
-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";
-const CustomSelect = ({
-  value,
-  onChange,
-  options,
-  placeholder = "Select...",
-  disabled = false,
-  className,
-  error,
-  enableSearch = false,
-  multiple = false,
-  triggerButton,
-  onClear,
-  showCheckbox = false,
-  triggerClassName,
-  tooltipContent,
-  enableTooltip = false,
-  tooltipPlacement = "top",
-  tooltipTriggerClassName
-}) => {
-  const [isOpen, setIsOpen] = useState(false);
-  const [searchQuery, setSearchQuery] = useState("");
-  const [coords, setCoords] = useState({ top: 0, left: 0, width: 0, maxHeight: 300 });
-  const containerRef = useRef(null);
-  const triggerRef = useRef(null);
-  const popoverRef = useRef(null);
-  const selectedOption = !multiple ? options.find((opt) => opt.value === value) : null;
-  const filteredOptions = enableSearch ? options.filter((opt) => opt.label.toLowerCase().includes(searchQuery.toLowerCase())) : options;
-  useEffect(() => {
-    if (isOpen && enableSearch) {
-      setSearchQuery("");
-    }
-  }, [isOpen, enableSearch]);
-  useEffect(() => {
-    const handleClickOutside = (event) => {
-      const target = event.target;
-      if (containerRef.current && !containerRef.current.contains(target) && popoverRef.current && !popoverRef.current.contains(target)) {
-        setIsOpen(false);
-      }
-    };
-    if (isOpen) {
-      document.addEventListener("mousedown", handleClickOutside);
-      window.addEventListener("scroll", updatePosition, true);
-      window.addEventListener("resize", updatePosition);
-    }
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-      window.removeEventListener("scroll", updatePosition, true);
-      window.removeEventListener("resize", updatePosition);
-    };
-  }, [isOpen]);
-  const updatePosition = () => {
-    if (triggerRef.current) {
-      const rect = triggerRef.current.getBoundingClientRect();
-      const viewportHeight = window.innerHeight;
-      const buffer = 8;
-      const spaceBelow = viewportHeight - rect.bottom - buffer - 16;
-      const spaceAbove = rect.top - buffer - 16;
-      let topPosition;
-      let maxHeightValue;
-      if (spaceBelow >= 200 || spaceBelow > spaceAbove) {
-        topPosition = rect.bottom + buffer;
-        maxHeightValue = Math.min(spaceBelow, 400);
-      } else {
-        topPosition = rect.bottom + buffer;
-        maxHeightValue = Math.min(spaceBelow, 400);
-      }
-      setCoords({
-        top: topPosition,
-        left: rect.left,
-        width: rect.width,
-        maxHeight: Math.max(100, maxHeightValue)
-      });
-    }
-  };
-  useEffect(() => {
-    if (isOpen) {
-      updatePosition();
-      const handleScroll = () => {
-        if (isOpen) updatePosition();
-      };
-      window.addEventListener("scroll", handleScroll, true);
-      window.addEventListener("resize", handleScroll);
-      return () => {
-        window.removeEventListener("scroll", handleScroll, true);
-        window.removeEventListener("resize", handleScroll);
-      };
-    }
-  }, [isOpen]);
-  const toggleOpen = () => {
-    if (!disabled) {
-      if (!isOpen) updatePosition();
-      setIsOpen(!isOpen);
-    }
-  };
-  const handleSelect = (val) => {
-    if (multiple) {
-      const currentValues = Array.isArray(value) ? value : [];
-      const isSelected = currentValues.includes(val);
-      let newValues;
-      if (isSelected) {
-        newValues = currentValues.filter((v) => v !== val);
-      } else {
-        newValues = [...currentValues, val];
-      }
-      onChange(newValues);
-    } else {
-      onChange(val);
-      setIsOpen(false);
-    }
-  };
-  const TriggerContent = /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      disabled,
-      className: cn(
-        "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__ */ 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__ */ jsx(ChevronDown, { className: cn("h-4 w-4 text-gray-500 transition-transform duration-200", isOpen && "rotate-180") })
-      ]
-    }
-  );
-  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,
-        content: tooltipContent,
-        children: TriggerContent
-      }
-    ) : TriggerContent }),
-    typeof document !== "undefined" && createPortal(
-      /* @__PURE__ */ jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsxs(
-        motion.div,
-        {
-          ref: popoverRef,
-          initial: { opacity: 0, y: -10, scale: 0.98 },
-          animate: { opacity: 1, y: 0, scale: 1 },
-          exit: { opacity: 0, y: -10, scale: 0.98 },
-          transition: { duration: 0.15, ease: "easeOut" },
-          style: {
-            position: "fixed",
-            top: coords.top,
-            left: coords.left,
-            width: Math.max(coords.width, 220),
-            zIndex: 99999,
-            transformOrigin: "top left"
-          },
-          className: "rounded-xl bg-white shadow-2xl border border-gray-200 hover:border-primaryx-700 flex flex-col p-1.5",
-          children: [
-            /* @__PURE__ */ jsxs(
-              "div",
-              {
-                style: { maxHeight: coords.maxHeight },
-                className: "w-full overflow-y-auto flex flex-col gap-0.5 px-0.5",
-                children: [
-                  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: "h-9"
-                    }
-                  ) }),
-                  filteredOptions.length > 0 ? filteredOptions.map((option) => {
-                    if (option.isLabel) {
-                      return /* @__PURE__ */ jsx(
-                        "div",
-                        {
-                          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__ */ jsxs(
-                      "div",
-                      {
-                        role: "button",
-                        tabIndex: 0,
-                        onClick: () => handleSelect(option.value),
-                        onKeyDown: (e) => {
-                          if (e.key === "Enter" || e.key === " ") {
-                            e.preventDefault();
-                            handleSelect(option.value);
-                          }
-                        },
-                        className: cn(
-                          "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__ */ jsxs("div", { className: "flex items-center space-x-3 text-left pointer-events-none", children: [
-                            showCheckbox && /* @__PURE__ */ jsx(
-                              Checkbox,
-                              {
-                                checked: isSelected,
-                                readOnly: true,
-                                className: "mr-1"
-                              }
-                            ),
-                            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__ */ jsx(Check, { className: "h-4 w-4 text-primaryx-600" })
-                        ]
-                      },
-                      option.value
-                    );
-                  }) : /* @__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__ */ jsx("div", { className: "mt-2 pt-2 border-t border-gray-100", children: /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => {
-                  onClear();
-                  setIsOpen(false);
-                },
-                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"
-              }
-            ) })
-          ]
-        }
-      ) }),
-      document.body
-    )
-  ] });
-};
-const CustomSelect$1 = memo(CustomSelect);
-export {
-  CustomSelect$1 as default
-};
-//# sourceMappingURL=CustomSelect.js.map

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

@@ -1 +0,0 @@
-{"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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"}