@mahatisystems/mahati-ui-components 0.1.1

package/dist/index.mjs

@@ -0,0 +1,1057 @@
+// src/components/Button.tsx
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _instanceof(left, right) {
+    if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
+        return !!right[Symbol.hasInstance](left);
+    } else {
+        return left instanceof right;
+    }
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+function _object_without_properties(source, excluded) {
+    if (source == null) return {};
+    var target = _object_without_properties_loose(source, excluded);
+    var key, i;
+    if (Object.getOwnPropertySymbols) {
+        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceSymbolKeys.length; i++){
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+function _object_without_properties_loose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for(i = 0; i < sourceKeys.length; i++){
+        key = sourceKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        target[key] = source[key];
+    }
+    return target;
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _type_of(obj) {
+    "@swc/helpers - typeof";
+    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+import React from "react";
+import { cva } from "class-variance-authority";
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn() {
+    for(var _len = arguments.length, inputs = new Array(_len), _key = 0; _key < _len; _key++){
+        inputs[_key] = arguments[_key];
+    }
+    return twMerge(clsx(inputs));
+}
+// src/components/Button.tsx
+var buttonVariants = cva(// Use regular Tailwind classes that will be processed by consumer's Tailwind
+"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90",
+            destructive: "purple",
+            outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            ghost: "hover:bg-accent hover:text-accent-foreground",
+            link: "text-primary underline-offset-4 hover:underline"
+        },
+        size: {
+            default: "h-10 px-4 py-2",
+            sm: "h-9 rounded-md px-3",
+            lg: "h-11 rounded-md px-8",
+            icon: "h-10 w-10"
+        }
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default"
+    }
+});
+var Button = React.forwardRef(function(_param, ref) {
+    var className = _param.className, variant = _param.variant, size = _param.size, _param_asChild = _param.asChild, asChild = _param_asChild === void 0 ? false : _param_asChild, props = _object_without_properties(_param, [
+        "className",
+        "variant",
+        "size",
+        "asChild"
+    ]);
+    return /* @__PURE__ */ React.createElement("button", _object_spread({
+        className: cn(buttonVariants({
+            variant: variant,
+            size: size,
+            className: className
+        })),
+        ref: ref
+    }, props));
+});
+Button.displayName = "Button";
+// src/components/Card.tsx
+import * as React2 from "react";
+import { cva as cva2 } from "class-variance-authority";
+import { ChevronDown, ChevronUp } from "lucide-react";
+var cardVariants = cva2("rounded-[14px] transition-all duration-300 shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]", {
+    variants: {
+        variant: {
+            default: "bg-white text-slate-800 border border-slate-200 hover:shadow-lg",
+            elevated: "bg-white shadow-md border border-transparent",
+            outline: "bg-slate-50 border border-slate-200",
+            subtle: "bg-slate-50 border border-transparent",
+            figma: ""
+        },
+        size: {
+            default: "p-6 rounded-[14px]",
+            sm: "p-4",
+            lg: "p-8",
+            figma: "w-[280px] p-6"
+        }
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default"
+    }
+});
+var Card = React2.forwardRef(function(_param, ref) {
+    var title = _param.title, cardContent = _param.cardContent, cardBackContent = _param.cardBackContent, _param_collapsible = _param.collapsible, collapsible = _param_collapsible === void 0 ? false : _param_collapsible, _param_flippable = _param.flippable, flippable = _param_flippable === void 0 ? false : _param_flippable, backgroundColor = _param.backgroundColor, borderRadius = _param.borderRadius, variant = _param.variant, size = _param.size, className = _param.className, children = _param.children, _param_defaultOpen = _param.defaultOpen, defaultOpen = _param_defaultOpen === void 0 ? true : _param_defaultOpen, onFlip = _param.onFlip, style = _param.style, props = _object_without_properties(_param, [
+        "title",
+        "cardContent",
+        "cardBackContent",
+        "collapsible",
+        "flippable",
+        "backgroundColor",
+        "borderRadius",
+        "variant",
+        "size",
+        "className",
+        "children",
+        "defaultOpen",
+        "onFlip",
+        "style"
+    ]);
+    var _React2_useState = _sliced_to_array(React2.useState(defaultOpen), 2), open = _React2_useState[0], setOpen = _React2_useState[1];
+    var _React2_useState1 = _sliced_to_array(React2.useState(false), 2), isFlipped = _React2_useState1[0], setIsFlipped = _React2_useState1[1];
+    var contentId = React2.useId();
+    var figmaStyles = variant === "figma" ? _object_spread({
+        backgroundColor: backgroundColor || "rgba(77, 175, 131, 0.10)",
+        border: "1px solid #1761A3",
+        boxShadow: "0 4px 4px 0 rgba(0, 0, 0, 0.25)",
+        borderRadius: "14px"
+    }, style) : backgroundColor ? _object_spread({
+        backgroundColor: backgroundColor
+    }, style) : style;
+    var handleFlip = function() {
+        if (!flippable) return;
+        var newFlippedState = !isFlipped;
+        setIsFlipped(newFlippedState);
+        onFlip === null || onFlip === void 0 ? void 0 : onFlip(newFlippedState);
+    };
+    var mainContent = cardContent || children;
+    return /* @__PURE__ */ React2.createElement("div", {
+        className: cn(flippable && "[perspective:1000px] group"),
+        onClick: handleFlip
+    }, /* @__PURE__ */ React2.createElement("div", _object_spread_props(_object_spread({
+        ref: ref
+    }, props), {
+        style: figmaStyles,
+        className: cn(cardVariants({
+            variant: variant,
+            size: size,
+            className: className
+        }), flippable && "relative transition-transform duration-700 [transform-style:preserve-3d]", flippable && isFlipped && "[transform:rotateY(180deg)]", className)
+    }), /* @__PURE__ */ React2.createElement("div", {
+        className: cn(flippable && "[backface-visibility:hidden]")
+    }, title && /* @__PURE__ */ React2.createElement("div", {
+        className: cn("flex items-center justify-between", {
+            "mb-4": open && mainContent
+        })
+    }, /* @__PURE__ */ React2.createElement("h4", {
+        className: "text-xl font-semibold text-slate-800"
+    }, title), collapsible && /* @__PURE__ */ React2.createElement("button", {
+        type: "button",
+        style: {
+            backgroundColor: "#1761A3"
+        },
+        className: "z-10 flex items-center justify-center w-8 h-8 rounded-full hover:opacity-80 transition-opacity duration-200 focus:outline-none focus:ring-2 focus:ring-[#1761A3] focus:ring-offset-2",
+        onClick: function(e) {
+            if (flippable) e.stopPropagation();
+            setOpen(function(p) {
+                return !p;
+            });
+        },
+        "aria-label": open ? "Hide content" : "Show content",
+        "aria-expanded": open,
+        "aria-controls": contentId
+    }, open ? /* @__PURE__ */ React2.createElement(ChevronUp, {
+        className: "w-5 h-5 text-white"
+    }) : /* @__PURE__ */ React2.createElement(ChevronDown, {
+        className: "w-5 h-5 text-white"
+    }))), mainContent && /* @__PURE__ */ React2.createElement("div", {
+        id: contentId,
+        className: cn("grid overflow-hidden transition-all duration-500 ease-in-out", open ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0")
+    }, /* @__PURE__ */ React2.createElement("div", {
+        className: "overflow-hidden"
+    }, mainContent))), flippable && cardBackContent && /* @__PURE__ */ React2.createElement("div", {
+        className: "absolute inset-0 w-full h-full p-6 [backface-visibility:hidden] [transform:rotateY(180deg)]"
+    }, cardBackContent)));
+});
+Card.displayName = "Card";
+// src/components/Modal.tsx
+import React3 from "react";
+var Modal = function(param) {
+    var isOpen = param.isOpen, onClose = param.onClose, title = param.title, children = param.children, className = param.className;
+    if (!isOpen) return null;
+    return /* @__PURE__ */ React3.createElement("div", {
+        className: "fixed inset-0 z-50"
+    }, /* @__PURE__ */ React3.createElement("div", {
+        className: "fixed inset-0 bg-black bg-opacity-50 transition-opacity",
+        onClick: onClose
+    }), /* @__PURE__ */ React3.createElement("div", {
+        className: "fixed inset-0 overflow-y-auto"
+    }, /* @__PURE__ */ React3.createElement("div", {
+        className: "flex min-h-full items-center justify-center p-4"
+    }, /* @__PURE__ */ React3.createElement("div", {
+        className: cn("relative transform overflow-hidden rounded-lg bg-white px-4 pb-4 pt-5 shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg sm:p-6", className),
+        onClick: function(e) {
+            return e.stopPropagation();
+        }
+    }, /* @__PURE__ */ React3.createElement("button", {
+        onClick: onClose,
+        className: "absolute right-4 top-4 text-gray-400 hover:text-gray-500"
+    }, /* @__PURE__ */ React3.createElement("span", {
+        className: "sr-only"
+    }, "Close"), /* @__PURE__ */ React3.createElement("svg", {
+        className: "h-6 w-6",
+        fill: "none",
+        viewBox: "0 0 24 24",
+        stroke: "currentColor"
+    }, /* @__PURE__ */ React3.createElement("path", {
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 2,
+        d: "M6 18L18 6M6 6l12 12"
+    }))), title && /* @__PURE__ */ React3.createElement("div", {
+        className: "mb-4"
+    }, /* @__PURE__ */ React3.createElement("h3", {
+        className: "text-lg font-medium leading-6 text-gray-900"
+    }, title)), /* @__PURE__ */ React3.createElement("div", {
+        className: "mt-2 text-black"
+    }, children)))));
+};
+Modal.displayName = "Modal";
+// src/components/FormContainer.tsx
+import React4 from "react";
+var FormContainer = function(param) {
+    var children = param.children, onSubmit = param.onSubmit, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className;
+    return /* @__PURE__ */ React4.createElement("form", {
+        onSubmit: onSubmit,
+        className: "\n        flex flex-col items-center justify-center\n        w-full max-w-[560px] min-h-[80vh] mx-auto p-6\n        bg-white shadow-lg rounded-lg\n        ".concat(className, "\n      ")
+    }, children);
+};
+FormContainer.displayName = "FormContainer";
+// src/components/Input.tsx
+import React5, { useEffect, useState as useState2 } from "react";
+var Input = function(param) {
+    var _param_type = param.type, type = _param_type === void 0 ? "text" : _param_type, name = param.name, placeholder = param.placeholder, onChange = param.onChange, _param_hasError = param.hasError, hasError = _param_hasError === void 0 ? false : _param_hasError, _param_errorMessage = param.errorMessage, errorMessage = _param_errorMessage === void 0 ? "" : _param_errorMessage, _param_value = param.value, value = _param_value === void 0 ? "" : _param_value, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className;
+    var _useState2 = _sliced_to_array(useState2(value), 2), internalValue = _useState2[0], setInternalValue = _useState2[1];
+    var _useState21 = _sliced_to_array(useState2(false), 2), showError = _useState21[0], setShowError = _useState21[1];
+    useEffect(function() {
+        setInternalValue(value);
+        setShowError(hasError || value === "");
+    }, [
+        value,
+        hasError
+    ]);
+    var handleChange = function(e) {
+        var newValue = e.target.value;
+        setInternalValue(newValue);
+        onChange(e);
+        setShowError(newValue === "");
+    };
+    return /* @__PURE__ */ React5.createElement("div", {
+        className: "mb-4"
+    }, /* @__PURE__ */ React5.createElement("input", {
+        type: type,
+        name: name,
+        placeholder: placeholder,
+        value: internalValue,
+        onChange: handleChange,
+        className: "\n          w-[438px] max-w-full h-[44px] flex-shrink-0\n          rounded-[6px] border\n          ".concat(showError ? "border-red-500" : "border-[#D9D9D9]", "\n          bg-white\n          text-base leading-5\n          outline-none\n          ").concat(className, "\n        ")
+    }), /* @__PURE__ */ React5.createElement("span", {
+        className: "block text-sm text-red-500 h-[0.8rem]"
+    }, errorMessage));
+};
+Input.displayName = "Input";
+// src/components/TabbedInterface.tsx
+import React6, { useState as useState3, useId as useId2 } from "react";
+var TabbedInterface = function(param) {
+    var tabs = param.tabs, _param_variant = param.variant, variant = _param_variant === void 0 ? "basic" : _param_variant, _param_defaultActiveTab = param.defaultActiveTab, defaultActiveTab = _param_defaultActiveTab === void 0 ? 0 : _param_defaultActiveTab, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, onTabChange = param.onTabChange;
+    var _tabs_activeTab;
+    var _useState3 = _sliced_to_array(useState3(defaultActiveTab), 2), activeTab = _useState3[0], setActiveTab = _useState3[1];
+    var id = useId2();
+    var PRIMARY_COLOR = "#1e73be";
+    var ACCENT_COLOR = "#4DAF83";
+    var handleTabClick = function(index) {
+        var _tabs_index;
+        if ((_tabs_index = tabs[index]) === null || _tabs_index === void 0 ? void 0 : _tabs_index.disabled) return;
+        setActiveTab(index);
+        onTabChange === null || onTabChange === void 0 ? void 0 : onTabChange(index);
+    };
+    var getTabButtonStyles = function(index) {
+        var _tabs_index;
+        var isActive = index === activeTab;
+        var baseStyles = "flex items-center justify-center gap-2 px-6 py-3 text-sm font-semibold transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 whitespace-nowrap flex-shrink-0";
+        var disabledStyles = "opacity-50 cursor-not-allowed";
+        if ((_tabs_index = tabs[index]) === null || _tabs_index === void 0 ? void 0 : _tabs_index.disabled) {
+            return "".concat(baseStyles, " ").concat(disabledStyles, " text-gray-500");
+        }
+        switch(variant){
+            case "basic":
+                return "".concat(baseStyles, " ").concat(isActive ? "text-[".concat(PRIMARY_COLOR, "] border-b-2 border-[").concat(PRIMARY_COLOR, "]") : "text-gray-600 hover:text-gray-800 hover:border-b-2 hover:border-gray-300");
+            case "underline":
+                return "".concat(baseStyles, " relative ").concat(isActive ? "text-[".concat(PRIMARY_COLOR, "]") : "text-gray-600 hover:text-gray-800");
+            case "pill":
+                return "".concat(baseStyles, " rounded-full font-semibold text-[14px] leading-normal ").concat(isActive ? "bg-white text-[".concat(PRIMARY_COLOR, "] border border-gray-400 shadow-md") : "bg-[#EEF4F7] text-[".concat(PRIMARY_COLOR, "] border border-[rgba(38,118,154,0.45)] hover:bg-blue-100"));
+            case "square":
+                return "".concat(baseStyles, " rounded-[6px] border border-[rgba(38,118,154,0.45)] font-semibold text-[14px] leading-normal ").concat(isActive ? "bg-white text-[".concat(PRIMARY_COLOR, "]") : "bg-[#EEF4F7] text-gray-600 hover:bg-gray-200");
+            case "dark":
+                return "".concat(baseStyles, " rounded-lg ").concat(isActive ? "bg-gray-700 text-white shadow-md" : "bg-gray-800 text-gray-300 hover:bg-gray-700 hover:text-white");
+            case "shadow":
+                return "".concat(baseStyles, " rounded-lg ").concat(isActive ? "bg-white text-[".concat(PRIMARY_COLOR, "] shadow-lg") : "bg-gray-50 text-gray-600 shadow-sm hover:bg-white");
+            case "glass":
+                return "".concat(baseStyles, " rounded-lg border border-white/30 backdrop-blur-lg ").concat(isActive ? "bg-[".concat(PRIMARY_COLOR, "]/40 text-white shadow-md") : "bg-white/20 text-[".concat(PRIMARY_COLOR, "] hover:bg-[").concat(PRIMARY_COLOR, "]/50 hover:text-white"));
+            case "gradient":
+                return "".concat(baseStyles, " rounded-lg ").concat(isActive ? "bg-gradient-to-r from-[".concat(PRIMARY_COLOR, "] to-[").concat(ACCENT_COLOR, "] text-white shadow-md") : "bg-gray-100 text-[".concat(PRIMARY_COLOR, "] hover:bg-gray-200"));
+            default:
+                return "".concat(baseStyles, " ").concat(isActive ? "text-[".concat(PRIMARY_COLOR, "]") : "text-gray-600 hover:text-gray-800");
+        }
+    };
+    var getUnderlineBarClasses = function(index) {
+        var isActive = index === activeTab;
+        if (variant === "underline") {
+            return "absolute bottom-0 left-0 h-[3px] bg-gradient-to-r from-[".concat(PRIMARY_COLOR, "] to-[").concat(ACCENT_COLOR, "] transition-all duration-300 ease-out ").concat(isActive ? "w-full" : "w-0");
+        }
+        return "hidden";
+    };
+    return /* @__PURE__ */ React6.createElement("div", {
+        className: "w-full bg-[#EEF4F7] rounded-lg border border-gray-200 shadow-sm ".concat(className)
+    }, /* @__PURE__ */ React6.createElement("div", {
+        className: "flex flex-row overflow-x-auto scrollbar-hide space-x-4 p-4",
+        role: "tablist"
+    }, tabs.map(function(tab, index) {
+        return /* @__PURE__ */ React6.createElement("button", {
+            key: tab.id || "tab-".concat(id, "-").concat(index),
+            className: getTabButtonStyles(index),
+            onClick: function() {
+                return handleTabClick(index);
+            },
+            disabled: tab.disabled,
+            "aria-selected": index === activeTab,
+            "aria-controls": "".concat(id, "-tabpanel-").concat(index),
+            role: "tab",
+            type: "button"
+        }, tab.icon && /* @__PURE__ */ React6.createElement("span", {
+            className: "flex-shrink-0 w-4 h-4"
+        }, tab.icon), /* @__PURE__ */ React6.createElement("span", {
+            className: "truncate"
+        }, tab.label), variant === "underline" && /* @__PURE__ */ React6.createElement("span", {
+            className: getUnderlineBarClasses(index)
+        }));
+    })), /* @__PURE__ */ React6.createElement("div", {
+        className: "h-[2px] flex-shrink-0 bg-[#D9D9D9]"
+    }), /* @__PURE__ */ React6.createElement("div", {
+        id: "".concat(id, "-tabpanel-").concat(activeTab),
+        role: "tabpanel",
+        "aria-labelledby": "".concat(id, "-tab-").concat(activeTab),
+        className: "p-6 animate-fade-in bg-white"
+    }, ((_tabs_activeTab = tabs[activeTab]) === null || _tabs_activeTab === void 0 ? void 0 : _tabs_activeTab.content) || /* @__PURE__ */ React6.createElement("div", {
+        className: "text-center text-gray-500 py-8"
+    }, "No content available for this tab")));
+};
+TabbedInterface.displayName = "TabbedInterface";
+// src/components/Table.tsx
+import React7, { useState as useState4 } from "react";
+import { ArrowDownOnSquareIcon, ArrowPathIcon, XMarkIcon } from "@heroicons/react/24/outline";
+var Table = function(param) {
+    var headers = param.headers, data = param.data, page = param.page, setPage = param.setPage, limit = param.limit, setLimit = param.setLimit, totalCount = param.totalCount, highlightRowColor = param.highlightRowColor, actions = param.actions, paginationRequired = param.paginationRequired, _param_paginationPosition = param.paginationPosition, paginationPosition = _param_paginationPosition === void 0 ? "bottom-center" : _param_paginationPosition, onDownloadPDF = param.onDownloadPDF, onDownloadExcel = param.onDownloadExcel, _param_searchable = param.searchable, searchable = _param_searchable === void 0 ? false : _param_searchable, _param_searchTerm = param.searchTerm, searchTerm = _param_searchTerm === void 0 ? "" : _param_searchTerm, onResetSearch = param.onResetSearch, onSearch = param.onSearch, _param_searchModeOptions = param.searchModeOptions, searchModeOptions = _param_searchModeOptions === void 0 ? [
+        "includes",
+        "startsWith"
+    ] : _param_searchModeOptions;
+    var _useState4 = _sliced_to_array(useState4(searchModeOptions[0]), 2), searchMode = _useState4[0], setSearchMode = _useState4[1];
+    var isPaginated = paginationRequired;
+    var handleChange = function(e) {
+        onSearch === null || onSearch === void 0 ? void 0 : onSearch(e.target.value, searchMode);
+    };
+    var totalPages = isPaginated ? Math.max(1, Math.ceil((totalCount || 0) / (limit || 1))) : 0;
+    var currentPage = isPaginated ? typeof page === "number" && page > 0 ? page : 1 : 1;
+    var goToPage = function(p) {
+        if (!isPaginated) return;
+        var clamped = Math.max(1, Math.min(totalPages, p));
+        setPage === null || setPage === void 0 ? void 0 : setPage(clamped);
+    };
+    var renderPageNumbers = function() {
+        var _loop = function(i) {
+            pages.push(/* @__PURE__ */ React7.createElement("button", {
+                key: i,
+                onClick: function() {
+                    return goToPage(i);
+                },
+                disabled: currentPage === i,
+                className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
+                style: {
+                    background: currentPage === i ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
+                }
+            }, i));
+        };
+        if (!isPaginated || totalPages <= 1) return null;
+        var pages = [];
+        var siblings = 1;
+        pages.push(/* @__PURE__ */ React7.createElement("button", {
+            key: 1,
+            onClick: function() {
+                return goToPage(1);
+            },
+            disabled: currentPage === 1,
+            className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
+            style: {
+                background: currentPage === 1 ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
+            }
+        }, "1"));
+        if (currentPage > siblings + 2) {
+            pages.push(/* @__PURE__ */ React7.createElement("span", {
+                key: "start-ellipsis",
+                className: "px-1 text-sm text-slate-500"
+            }, "..."));
+        }
+        var start = Math.max(2, currentPage - siblings);
+        var end = Math.min(totalPages - 1, currentPage + siblings);
+        for(var i = start; i <= end; i++)_loop(i);
+        if (currentPage < totalPages - siblings - 1) {
+            pages.push(/* @__PURE__ */ React7.createElement("span", {
+                key: "end-ellipsis",
+                className: "px-1 text-sm text-slate-500"
+            }, "..."));
+        }
+        if (totalPages > 1) {
+            pages.push(/* @__PURE__ */ React7.createElement("button", {
+                key: totalPages,
+                onClick: function() {
+                    return goToPage(totalPages);
+                },
+                disabled: currentPage === totalPages,
+                className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
+                style: {
+                    background: currentPage === totalPages ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
+                }
+            }, totalPages));
+        }
+        return pages;
+    };
+    var renderPagination = function() {
+        if (!isPaginated) return null;
+        var align = paginationPosition.includes("left") ? "justify-start" : paginationPosition.includes("right") ? "justify-end" : "justify-center";
+        return /* @__PURE__ */ React7.createElement("div", {
+            className: "my-2 flex w-full ".concat(align)
+        }, /* @__PURE__ */ React7.createElement("div", {
+            className: "flex flex-wrap items-center justify-center gap-2"
+        }, /* @__PURE__ */ React7.createElement("button", {
+            onClick: function() {
+                return goToPage(currentPage - 1);
+            },
+            disabled: currentPage === 1,
+            className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
+            style: {
+                background: currentPage === 1 ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
+            }
+        }, "Previous"), renderPageNumbers(), /* @__PURE__ */ React7.createElement("button", {
+            onClick: function() {
+                return goToPage(currentPage + 1);
+            },
+            disabled: currentPage === totalPages,
+            className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
+            style: {
+                background: currentPage === totalPages ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
+            }
+        }, "Next"), /* @__PURE__ */ React7.createElement("select", {
+            value: limit,
+            onChange: function(e) {
+                setPage === null || setPage === void 0 ? void 0 : setPage(1);
+                setLimit === null || setLimit === void 0 ? void 0 : setLimit(Number(e.target.value));
+            },
+            className: "ml-2 rounded-md border border-slate-300 px-2 py-1 text-sm text-slate-700"
+        }, [
+            5,
+            10,
+            15
+        ].map(function(size) {
+            return /* @__PURE__ */ React7.createElement("option", {
+                key: size,
+                value: size
+            }, size);
+        })), /* @__PURE__ */ React7.createElement("span", {
+            className: "ml-2 text-xs text-slate-600"
+        }, "Page ", currentPage, " of ", totalPages, " (Total: ", totalCount, " items)")));
+    };
+    return /* @__PURE__ */ React7.createElement(React7.Fragment, null, (searchable || onDownloadExcel || onDownloadPDF) && /* @__PURE__ */ React7.createElement("div", {
+        className: "mb-3 flex flex-wrap items-center justify-between gap-3"
+    }, searchable && /* @__PURE__ */ React7.createElement("div", {
+        className: "flex items-center gap-2"
+    }, /* @__PURE__ */ React7.createElement("div", {
+        className: "relative flex items-center"
+    }, /* @__PURE__ */ React7.createElement("input", {
+        type: "text",
+        placeholder: "Search...",
+        value: searchTerm,
+        onChange: handleChange,
+        className: "w-56 rounded-lg border border-transparent bg-white px-3 py-2 pr-8 text-sm font-medium text-[#1761A3] shadow-sm outline-none ring-1 ring-transparent transition focus:border-transparent focus:ring-2 focus:ring-emerald-400"
+    }), searchTerm && /* @__PURE__ */ React7.createElement("button", {
+        onClick: onResetSearch,
+        "aria-label": "Clear search",
+        className: "absolute right-2 flex h-6 w-6 items-center justify-center rounded-full text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
+    }, /* @__PURE__ */ React7.createElement(XMarkIcon, {
+        className: "h-4 w-4"
+    }))), /* @__PURE__ */ React7.createElement("select", {
+        value: searchMode,
+        onChange: function(e) {
+            return setSearchMode(e.target.value);
+        },
+        className: "rounded-lg border border-transparent bg-white px-2 py-2 text-sm font-medium text-slate-700 shadow-sm outline-none ring-1 ring-transparent transition hover:bg-slate-50 focus:border-transparent focus:ring-2 focus:ring-emerald-400"
+    }, searchModeOptions.map(function(mode) {
+        return /* @__PURE__ */ React7.createElement("option", {
+            key: mode,
+            value: mode
+        }, mode === "startsWith" ? "Starts With" : "Includes");
+    }))), (onDownloadPDF || onDownloadExcel) && /* @__PURE__ */ React7.createElement("div", {
+        className: "mt-1 flex items-center gap-2"
+    }, onDownloadPDF && /* @__PURE__ */ React7.createElement("button", {
+        onClick: function() {
+            return onDownloadPDF(data, headers);
+        },
+        className: "inline-flex items-center gap-1 rounded-md px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90",
+        style: {
+            background: "linear-gradient(to right, #1e73be, #28a97d)"
+        }
+    }, /* @__PURE__ */ React7.createElement(ArrowDownOnSquareIcon, {
+        className: "h-5 w-5"
+    })), onDownloadExcel && /* @__PURE__ */ React7.createElement("button", {
+        onClick: function() {
+            return onDownloadExcel(data, headers);
+        },
+        className: "inline-flex items-center gap-1 rounded-md px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90",
+        style: {
+            background: "linear-gradient(to right, #1e73be, #28a97d)"
+        }
+    }, /* @__PURE__ */ React7.createElement(ArrowDownOnSquareIcon, {
+        className: "h-5 w-5"
+    }), /* @__PURE__ */ React7.createElement("span", null, "Excel")))), paginationPosition.startsWith("top") && data.length > 0 && renderPagination(), /* @__PURE__ */ React7.createElement("div", {
+        className: "mt-1 overflow-hidden rounded-xl border border-[#1761A3] bg-white"
+    }, /* @__PURE__ */ React7.createElement("table", {
+        className: "w-full border-collapse"
+    }, /* @__PURE__ */ React7.createElement("thead", {
+        style: {
+            background: "linear-gradient(to right, #1e73be, #28a97d)"
+        }
+    }, /* @__PURE__ */ React7.createElement("tr", null, headers.map(function(header, idx) {
+        return /* @__PURE__ */ React7.createElement("th", {
+            key: idx,
+            className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white first:rounded-tl-xl last:rounded-tr-xl"
+        }, header.label);
+    }), actions && /* @__PURE__ */ React7.createElement("th", {
+        className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white"
+    }, "Actions"))), /* @__PURE__ */ React7.createElement("tbody", null, data.length > 0 ? data.map(function(row, rowIndex) {
+        return /* @__PURE__ */ React7.createElement("tr", {
+            key: rowIndex,
+            className: "h-[57px] border-b border-slate-200 text-sm text-slate-900 even:bg-slate-50 hover:bg-slate-100 ".concat(highlightRowColor || "")
+        }, headers.map(function(header, cellIdx) {
+            return /* @__PURE__ */ React7.createElement("td", {
+                key: cellIdx,
+                className: "px-3 py-2"
+            }, function() {
+                var value = row[header.key];
+                if (React7.isValidElement(value)) return value;
+                if (typeof value === "function") {
+                    try {
+                        var result = value();
+                        if (React7.isValidElement(result)) return result;
+                    } catch (e) {
+                        console.warn("Error executing function in table cell:", e);
+                    }
+                }
+                if (typeof value === "string" && value.trim().startsWith("<") && value.trim().endsWith(">")) {
+                    return /* @__PURE__ */ React7.createElement("span", {
+                        dangerouslySetInnerHTML: {
+                            __html: value
+                        }
+                    });
+                }
+                if (Array.isArray(value)) {
+                    if (value.some(function(item) {
+                        return React7.isValidElement(item);
+                    })) {
+                        return /* @__PURE__ */ React7.createElement(React7.Fragment, null, value);
+                    }
+                    return value.join(", ");
+                }
+                if (_instanceof(value, Date)) return value.toLocaleString();
+                if (typeof value === "boolean") return value ? "Yes" : "No";
+                if (value === null || value === void 0) return "-";
+                if (typeof value === "number") return value.toString();
+                if ((typeof value === "undefined" ? "undefined" : _type_of(value)) === "object") return JSON.stringify(value);
+                return String(value);
+            }());
+        }), actions && /* @__PURE__ */ React7.createElement("td", {
+            className: "px-3 py-2"
+        }, actions(row)));
+    }) : /* @__PURE__ */ React7.createElement("tr", null, /* @__PURE__ */ React7.createElement("td", {
+        colSpan: headers.length + (actions ? 1 : 0),
+        className: "px-4 py-6 text-center text-slate-500"
+    }, /* @__PURE__ */ React7.createElement("div", {
+        className: "flex items-center justify-center gap-4"
+    }, /* @__PURE__ */ React7.createElement("span", null, "No records found."), onResetSearch && /* @__PURE__ */ React7.createElement("button", {
+        onClick: onResetSearch,
+        className: "inline-flex items-center gap-1 rounded-md px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90",
+        style: {
+            background: "linear-gradient(to right, #1e73be, #28a97d)"
+        }
+    }, /* @__PURE__ */ React7.createElement("span", null, "Reset"), /* @__PURE__ */ React7.createElement(ArrowPathIcon, {
+        className: "h-5 w-5"
+    })))))))), paginationPosition.startsWith("bottom") && data.length > 0 && renderPagination());
+};
+Table.displayName = "Table";
+// src/components/TableTailwindCSS.tsx
+import React8, { useState as useState5 } from "react";
+import { ArrowDownOnSquareIcon as ArrowDownOnSquareIcon2, ArrowPathIcon as ArrowPathIcon2, XMarkIcon as XMarkIcon2 } from "@heroicons/react/24/outline";
+var TableTailwind = function(param) {
+    var headers = param.headers, data = param.data, page = param.page, setPage = param.setPage, limit = param.limit, setLimit = param.setLimit, totalCount = param.totalCount, highlightRowColor = param.highlightRowColor, actions = param.actions, paginationRequired = param.paginationRequired, _param_paginationPosition = param.paginationPosition, paginationPosition = _param_paginationPosition === void 0 ? "bottom-center" : _param_paginationPosition, onDownloadPDF = param.onDownloadPDF, onDownloadExcel = param.onDownloadExcel, _param_searchable = param.searchable, searchable = _param_searchable === void 0 ? false : _param_searchable, _param_searchTerm = param.searchTerm, searchTerm = _param_searchTerm === void 0 ? "" : _param_searchTerm, onResetSearch = param.onResetSearch, onSearch = param.onSearch, _param_searchModeOptions = param.searchModeOptions, searchModeOptions = _param_searchModeOptions === void 0 ? [
+        "includes",
+        "startsWith"
+    ] : _param_searchModeOptions;
+    var _useState5 = _sliced_to_array(useState5(searchModeOptions[0]), 2), searchMode = _useState5[0], setSearchMode = _useState5[1];
+    var isPaginated = paginationRequired;
+    var handleChange = function(e) {
+        onSearch === null || onSearch === void 0 ? void 0 : onSearch(e.target.value, searchMode);
+    };
+    var totalPages = isPaginated ? Math.max(1, Math.ceil((totalCount || 0) / (limit || 1))) : 0;
+    var currentPage = isPaginated ? typeof page === "number" && page > 0 ? page : 1 : 1;
+    var goToPage = function(p) {
+        if (!isPaginated) return;
+        var clamped = Math.max(1, Math.min(totalPages, p));
+        setPage === null || setPage === void 0 ? void 0 : setPage(clamped);
+    };
+    var renderPageNumbers = function() {
+        var _loop = function(i) {
+            pages.push(/* @__PURE__ */ React8.createElement("button", {
+                key: i,
+                onClick: function() {
+                    return goToPage(i);
+                },
+                disabled: currentPage === i,
+                className: "inline-flex items-center rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50"
+            }, i));
+        };
+        if (!isPaginated || totalPages <= 1) return null;
+        var pages = [];
+        var siblings = 1;
+        pages.push(/* @__PURE__ */ React8.createElement("button", {
+            key: 1,
+            onClick: function() {
+                return goToPage(1);
+            },
+            disabled: currentPage === 1,
+            className: "inline-flex items-center rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50"
+        }, "1"));
+        if (currentPage > siblings + 2) {
+            pages.push(/* @__PURE__ */ React8.createElement("span", {
+                key: "start-ellipsis",
+                className: "px-1 text-sm text-slate-500"
+            }, "..."));
+        }
+        var start = Math.max(2, currentPage - siblings);
+        var end = Math.min(totalPages - 1, currentPage + siblings);
+        for(var i = start; i <= end; i++)_loop(i);
+        if (currentPage < totalPages - siblings - 1) {
+            pages.push(/* @__PURE__ */ React8.createElement("span", {
+                key: "end-ellipsis",
+                className: "px-1 text-sm text-slate-500"
+            }, "..."));
+        }
+        if (totalPages > 1) {
+            pages.push(/* @__PURE__ */ React8.createElement("button", {
+                key: totalPages,
+                onClick: function() {
+                    return goToPage(totalPages);
+                },
+                disabled: currentPage === totalPages,
+                className: "inline-flex items-center rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50"
+            }, totalPages));
+        }
+        return pages;
+    };
+    var renderPagination = function() {
+        if (!isPaginated) return null;
+        var align = paginationPosition.includes("left") ? "justify-start" : paginationPosition.includes("right") ? "justify-end" : "justify-center";
+        return /* @__PURE__ */ React8.createElement("div", {
+            className: "my-2 flex w-full ".concat(align)
+        }, /* @__PURE__ */ React8.createElement("div", {
+            className: "flex flex-wrap items-center justify-center gap-2"
+        }, /* @__PURE__ */ React8.createElement("button", {
+            onClick: function() {
+                return goToPage(currentPage - 1);
+            },
+            disabled: currentPage === 1,
+            className: "inline-flex items-center rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50"
+        }, "Previous"), renderPageNumbers(), /* @__PURE__ */ React8.createElement("button", {
+            onClick: function() {
+                return goToPage(currentPage + 1);
+            },
+            disabled: currentPage === totalPages,
+            className: "inline-flex items-center rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50"
+        }, "Next"), /* @__PURE__ */ React8.createElement("select", {
+            value: limit,
+            onChange: function(e) {
+                setPage === null || setPage === void 0 ? void 0 : setPage(1);
+                setLimit === null || setLimit === void 0 ? void 0 : setLimit(Number(e.target.value));
+            },
+            className: "ml-2 rounded-md border border-slate-300 px-2 py-1 text-sm text-slate-700"
+        }, [
+            5,
+            10,
+            15
+        ].map(function(size) {
+            return /* @__PURE__ */ React8.createElement("option", {
+                key: size,
+                value: size
+            }, size);
+        })), /* @__PURE__ */ React8.createElement("span", {
+            className: "ml-2 text-xs text-slate-600"
+        }, "Page ", currentPage, " of ", totalPages, " (Total: ", totalCount, " items)")));
+    };
+    return /* @__PURE__ */ React8.createElement(React8.Fragment, null, (searchable || onDownloadExcel || onDownloadPDF) && /* @__PURE__ */ React8.createElement("div", {
+        className: "mb-3 flex flex-wrap items-center justify-between gap-3"
+    }, searchable && /* @__PURE__ */ React8.createElement("div", {
+        className: "flex items-center gap-2"
+    }, /* @__PURE__ */ React8.createElement("div", {
+        className: "relative flex items-center"
+    }, /* @__PURE__ */ React8.createElement("input", {
+        type: "text",
+        placeholder: "Search...",
+        value: searchTerm,
+        onChange: handleChange,
+        className: "w-56 rounded-lg border border-transparent bg-white px-3 py-2 pr-8 text-sm font-medium text-[#1761A3] shadow-sm outline-none ring-1 ring-transparent transition focus:border-transparent focus:ring-2 focus:ring-emerald-400"
+    }), searchTerm && /* @__PURE__ */ React8.createElement("button", {
+        onClick: onResetSearch,
+        "aria-label": "Clear search",
+        className: "absolute right-2 flex h-6 w-6 items-center justify-center rounded-full text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
+    }, /* @__PURE__ */ React8.createElement(XMarkIcon2, {
+        className: "h-4 w-4"
+    }))), /* @__PURE__ */ React8.createElement("select", {
+        value: searchMode,
+        onChange: function(e) {
+            return setSearchMode(e.target.value);
+        },
+        className: "rounded-lg border border-transparent bg-white px-2 py-2 text-sm font-medium text-slate-700 shadow-sm outline-none ring-1 ring-transparent transition hover:bg-slate-50 focus:border-transparent focus:ring-2 focus:ring-emerald-400"
+    }, searchModeOptions.map(function(mode) {
+        return /* @__PURE__ */ React8.createElement("option", {
+            key: mode,
+            value: mode
+        }, mode === "startsWith" ? "Starts With" : "Includes");
+    }))), (onDownloadPDF || onDownloadExcel) && /* @__PURE__ */ React8.createElement("div", {
+        className: "mt-1 flex items-center gap-2"
+    }, onDownloadPDF && /* @__PURE__ */ React8.createElement("button", {
+        onClick: function() {
+            return onDownloadPDF(data, headers);
+        },
+        className: "inline-flex items-center gap-1 rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90"
+    }, /* @__PURE__ */ React8.createElement(ArrowDownOnSquareIcon2, {
+        className: "h-5 w-5"
+    })), onDownloadExcel && /* @__PURE__ */ React8.createElement("button", {
+        onClick: function() {
+            return onDownloadExcel(data, headers);
+        },
+        className: "inline-flex items-center gap-1 rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90"
+    }, /* @__PURE__ */ React8.createElement(ArrowDownOnSquareIcon2, {
+        className: "h-5 w-5"
+    }), /* @__PURE__ */ React8.createElement("span", null, "Excel")))), paginationPosition.startsWith("top") && data.length > 0 && renderPagination(), /* @__PURE__ */ React8.createElement("div", {
+        className: "mt-1 overflow-hidden rounded-xl border border-[#1761A3] bg-white"
+    }, /* @__PURE__ */ React8.createElement("table", {
+        className: "w-full border-collapse"
+    }, /* @__PURE__ */ React8.createElement("thead", {
+        className: "bg-gradient-to-r from-[#1e73be] to-[#28a97d]"
+    }, /* @__PURE__ */ React8.createElement("tr", null, headers.map(function(header, idx) {
+        return /* @__PURE__ */ React8.createElement("th", {
+            key: idx,
+            className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white first:rounded-tl-xl last:rounded-tr-xl"
+        }, header.label);
+    }), actions && /* @__PURE__ */ React8.createElement("th", {
+        className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white"
+    }, "Actions"))), /* @__PURE__ */ React8.createElement("tbody", null, data.length > 0 ? data.map(function(row, rowIndex) {
+        return /* @__PURE__ */ React8.createElement("tr", {
+            key: rowIndex,
+            className: "h-[57px] border-b border-slate-200 text-sm text-slate-900 even:bg-slate-50 hover:bg-slate-100 ".concat(highlightRowColor || "")
+        }, headers.map(function(header, cellIdx) {
+            return /* @__PURE__ */ React8.createElement("td", {
+                key: cellIdx,
+                className: "px-3 py-2"
+            }, function() {
+                var value = row[header.key];
+                if (React8.isValidElement(value)) return value;
+                if (typeof value === "function") {
+                    try {
+                        var result = value();
+                        if (React8.isValidElement(result)) return result;
+                    } catch (e) {
+                        console.warn("Error executing function in table cell:", e);
+                    }
+                }
+                if (typeof value === "string" && value.trim().startsWith("<") && value.trim().endsWith(">")) {
+                    return /* @__PURE__ */ React8.createElement("span", {
+                        dangerouslySetInnerHTML: {
+                            __html: value
+                        }
+                    });
+                }
+                if (Array.isArray(value)) {
+                    if (value.some(function(item) {
+                        return React8.isValidElement(item);
+                    })) {
+                        return /* @__PURE__ */ React8.createElement(React8.Fragment, null, value);
+                    }
+                    return value.join(", ");
+                }
+                if (_instanceof(value, Date)) return value.toLocaleString();
+                if (typeof value === "boolean") return value ? "Yes" : "No";
+                if (value === null || value === void 0) return "-";
+                if (typeof value === "number") return value.toString();
+                if ((typeof value === "undefined" ? "undefined" : _type_of(value)) === "object") return JSON.stringify(value);
+                return String(value);
+            }());
+        }), actions && /* @__PURE__ */ React8.createElement("td", {
+            className: "px-3 py-2"
+        }, actions(row)));
+    }) : /* @__PURE__ */ React8.createElement("tr", null, /* @__PURE__ */ React8.createElement("td", {
+        colSpan: headers.length + (actions ? 1 : 0),
+        className: "px-4 py-6 text-center text-slate-500"
+    }, /* @__PURE__ */ React8.createElement("div", {
+        className: "flex items-center justify-center gap-4"
+    }, /* @__PURE__ */ React8.createElement("span", null, "No records found."), onResetSearch && /* @__PURE__ */ React8.createElement("button", {
+        onClick: onResetSearch,
+        className: "inline-flex items-center gap-1 rounded-md bg-gradient-to-r from-[#1e73be] to-[#28a97d] px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90"
+    }, /* @__PURE__ */ React8.createElement("span", null, "Reset"), /* @__PURE__ */ React8.createElement(ArrowPathIcon2, {
+        className: "h-5 w-5"
+    })))))))), paginationPosition.startsWith("bottom") && data.length > 0 && renderPagination());
+};
+TableTailwind.displayName = "TableTailwind";
+// src/components/TooltipTailwindCSS.tsx
+import React9, { useState as useState6 } from "react";
+var Tooltip = function(param) {
+    var text = param.text, _param_position = param.position, position = _param_position === void 0 ? "top" : _param_position, children = param.children, _param_variant = param.variant, variant = _param_variant === void 0 ? "default" : _param_variant, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_textColor = param.textColor, textColor = _param_textColor === void 0 ? "text-gray-800" : _param_textColor, _param_backgroundColor = param.backgroundColor, backgroundColor = _param_backgroundColor === void 0 ? "bg-[rgba(23,97,163,1)] bg-gradient-to-r from-[rgba(23,97,163,1)] to-[rgba(77,175,131,1)]" : _param_backgroundColor, image = param.image, animation = param.animation;
+    var _useState6 = _sliced_to_array(useState6(false), 2), visible = _useState6[0], setVisible = _useState6[1];
+    var _useState61 = _sliced_to_array(useState6(false), 2), showAnimation = _useState61[0], setShowAnimation = _useState61[1];
+    var showTooltip = function() {
+        setVisible(true);
+        if (animation) {
+            var delay = animation.triggerDelay || 100;
+            setTimeout(function() {
+                return setShowAnimation(true);
+            }, delay);
+        }
+    };
+    var hideTooltip = function() {
+        setVisible(false);
+        setShowAnimation(false);
+    };
+    var containerClasses = "relative inline-block ".concat(className);
+    var defaultTooltipClasses = "\n    absolute z-50 \n    font-poppins \n    font-medium \n    \n    text-[rgba(255,255,255,1)]\n    text-[10px] \n    leading-normal \n    not-italic\n    rounded \n    shadow-sm \n    transition-opacity \n    duration-200\n    w-[98px] \n    h-[26px] \n    flex-shrink-0 flex \n    items-center \n    justify-center\n    bg-[rgba(23,97,163,1)] \n    bg-gradient-to-r from-[rgba(23,97,163,1)] to-[rgba(77,175,131,1)]\n    ".concat(visible ? "opacity-100" : "opacity-0 pointer-events-none", "\n    ").concat(image ? "" : "px-3 py-3", "\n  ");
+    var transparentTooltipClasses = "\n    absolute z-50 font-medium ".concat(textColor, "\n    rounded transition-all duration-200\n    ").concat(visible ? "opacity-100 scale-100" : "opacity-0 scale-95 pointer-events-none", "\n    ").concat(image ? "p-1" : "px-3 py-2", "\n  ");
+    var positionClasses = {
+        top: "bottom-full left-1/2 transform -translate-x-1/2 -translate-y-2 mb-2",
+        right: "left-full top-1/2 transform -translate-y-1/2 translate-x-2 ml-2",
+        bottom: "top-full left-1/2 transform -translate-x-1/2 translate-y-2 mt-2",
+        left: "right-full top-1/2 transform -translate-y-1/2 -translate-x-2 mr-2"
+    };
+    var arrowBaseClasses = "absolute w-2 h-2 transform rotate-45";
+    var arrowPositionClasses = {
+        top: "bottom-[-4px] left-1/2 transform -translate-x-1/2",
+        right: "left-[-4px] top-1/2 transform -translate-y-1/2",
+        bottom: "top-[-4px] left-1/2 transform -translate-x-1/2",
+        left: "right-[-4px] top-1/2 transform -translate-y-1/2"
+    };
+    var arrowBackgroundClass = "bg-[rgba(23,97,163,1)]";
+    var tooltipClasses = variant === "transparent" ? "".concat(transparentTooltipClasses, " ").concat(positionClasses[position]) : "".concat(defaultTooltipClasses, " ").concat(positionClasses[position]);
+    var renderTooltipContent = function() {
+        if (image) {
+            return /* @__PURE__ */ React9.createElement("img", {
+                src: image.src,
+                alt: image.alt || "Tooltip image",
+                width: image.width || 200,
+                height: image.height || 150,
+                className: "rounded-md object-cover",
+                loading: "lazy"
+            });
+        }
+        return text;
+    };
+    var renderAnimation = function() {
+        if (!animation || !showAnimation) return null;
+        var AnimationComponent = animation.component;
+        return /* @__PURE__ */ React9.createElement(AnimationComponent, _object_spread({
+            isActive: showAnimation
+        }, animation.props));
+    };
+    return /* @__PURE__ */ React9.createElement("div", {
+        className: containerClasses,
+        onMouseEnter: showTooltip,
+        onMouseLeave: hideTooltip,
+        onFocus: showTooltip,
+        onBlur: hideTooltip
+    }, children, renderAnimation(), /* @__PURE__ */ React9.createElement("div", {
+        className: tooltipClasses,
+        role: "tooltip"
+    }, renderTooltipContent(), variant === "default" && !image && /* @__PURE__ */ React9.createElement("div", {
+        className: "".concat(arrowBaseClasses, " ").concat(arrowPositionClasses[position], " ").concat(arrowBackgroundClass, " rounded-sm")
+    })));
+};
+Tooltip.displayName = "Tooltip";
+// src/components/Dropdown.tsx
+import React10, { useState as useState7 } from "react";
+var variantStyles = {
+    basic: "bg-blue-600 text-white hover:bg-blue-700",
+    outline: "border border-blue-600 text-blue-600 hover:bg-blue-50",
+    pill: "bg-blue-600 text-white rounded-full hover:bg-blue-700",
+    dark: "bg-gray-800 text-white hover:bg-gray-700",
+    underline: "border-b-2 border-blue-500 bg-transparent text-blue-700 hover:bg-blue-50",
+    shadow: "bg-white text-gray-700 shadow-md hover:shadow-lg border border-gray-200",
+    glass: "bg-white/20 backdrop-blur-md text-white border border-white/40 hover:bg-white/30",
+    gradient: "bg-gradient-to-r from-blue-500 to-purple-500 text-white hover:opacity-90"
+};
+var Dropdown = function(param) {
+    var options = param.options, onSelect = param.onSelect, _param_variant = param.variant, variant = _param_variant === void 0 ? "basic" : _param_variant;
+    var _useState7 = _sliced_to_array(useState7(false), 2), open = _useState7[0], setOpen = _useState7[1];
+    var _useState71 = _sliced_to_array(useState7(null), 2), selected = _useState71[0], setSelected = _useState71[1];
+    var handleSelect = function(option) {
+        setSelected(option);
+        onSelect(option);
+        setOpen(false);
+    };
+    return /* @__PURE__ */ React10.createElement("div", {
+        className: "relative w-56"
+    }, /* @__PURE__ */ React10.createElement("button", {
+        onClick: function() {
+            return setOpen(!open);
+        },
+        className: "w-full text-left px-4 py-2 rounded-md transition-all duration-200 ".concat(variantStyles[variant])
+    }, selected || "Select an option"), open && /* @__PURE__ */ React10.createElement("div", {
+        className: "absolute mt-2 w-full bg-white border border-gray-200 rounded-md shadow-lg z-20"
+    }, options.map(function(opt, idx) {
+        return /* @__PURE__ */ React10.createElement("div", {
+            key: idx,
+            onClick: function() {
+                return handleSelect(opt);
+            },
+            className: "px-4 py-2 cursor-pointer hover:bg-gray-100 text-gray-700"
+        }, opt);
+    })));
+};
+Dropdown.displayName = "Dropdown";
+export { Button as MahatiButton, Card as MahatiCard, Dropdown as MahatiDropdown, FormContainer as MahatiFormContainer, Input as MahatiInput, Modal as MahatiModal, TabbedInterface as MahatiTabbedInterface, Table as MahatiTable, TableTailwind as MahatiTableTailwind, Tooltip as MahatiTooltip };
+//# sourceMappingURL=index.mjs.map