@mahatisystems/mahati-ui-components 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js ADDED
@@ -0,0 +1,1163 @@
1
+ "use strict";
2
+ function _array_like_to_array(arr, len) {
3
+ if (len == null || len > arr.length) len = arr.length;
4
+ for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
5
+ return arr2;
6
+ }
7
+ function _array_with_holes(arr) {
8
+ if (Array.isArray(arr)) return arr;
9
+ }
10
+ function _define_property(obj, key, value) {
11
+ if (key in obj) {
12
+ Object.defineProperty(obj, key, {
13
+ value: value,
14
+ enumerable: true,
15
+ configurable: true,
16
+ writable: true
17
+ });
18
+ } else {
19
+ obj[key] = value;
20
+ }
21
+ return obj;
22
+ }
23
+ function _instanceof(left, right) {
24
+ if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
25
+ return !!right[Symbol.hasInstance](left);
26
+ } else {
27
+ return left instanceof right;
28
+ }
29
+ }
30
+ function _iterable_to_array_limit(arr, i) {
31
+ var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
32
+ if (_i == null) return;
33
+ var _arr = [];
34
+ var _n = true;
35
+ var _d = false;
36
+ var _s, _e;
37
+ try {
38
+ for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
39
+ _arr.push(_s.value);
40
+ if (i && _arr.length === i) break;
41
+ }
42
+ } catch (err) {
43
+ _d = true;
44
+ _e = err;
45
+ } finally{
46
+ try {
47
+ if (!_n && _i["return"] != null) _i["return"]();
48
+ } finally{
49
+ if (_d) throw _e;
50
+ }
51
+ }
52
+ return _arr;
53
+ }
54
+ function _non_iterable_rest() {
55
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
56
+ }
57
+ function _object_spread(target) {
58
+ for(var i = 1; i < arguments.length; i++){
59
+ var source = arguments[i] != null ? arguments[i] : {};
60
+ var ownKeys = Object.keys(source);
61
+ if (typeof Object.getOwnPropertySymbols === "function") {
62
+ ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
63
+ return Object.getOwnPropertyDescriptor(source, sym).enumerable;
64
+ }));
65
+ }
66
+ ownKeys.forEach(function(key) {
67
+ _define_property(target, key, source[key]);
68
+ });
69
+ }
70
+ return target;
71
+ }
72
+ function ownKeys(object, enumerableOnly) {
73
+ var keys = Object.keys(object);
74
+ if (Object.getOwnPropertySymbols) {
75
+ var symbols = Object.getOwnPropertySymbols(object);
76
+ if (enumerableOnly) {
77
+ symbols = symbols.filter(function(sym) {
78
+ return Object.getOwnPropertyDescriptor(object, sym).enumerable;
79
+ });
80
+ }
81
+ keys.push.apply(keys, symbols);
82
+ }
83
+ return keys;
84
+ }
85
+ function _object_spread_props(target, source) {
86
+ source = source != null ? source : {};
87
+ if (Object.getOwnPropertyDescriptors) {
88
+ Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
89
+ } else {
90
+ ownKeys(Object(source)).forEach(function(key) {
91
+ Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
92
+ });
93
+ }
94
+ return target;
95
+ }
96
+ function _object_without_properties(source, excluded) {
97
+ if (source == null) return {};
98
+ var target = _object_without_properties_loose(source, excluded);
99
+ var key, i;
100
+ if (Object.getOwnPropertySymbols) {
101
+ var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
102
+ for(i = 0; i < sourceSymbolKeys.length; i++){
103
+ key = sourceSymbolKeys[i];
104
+ if (excluded.indexOf(key) >= 0) continue;
105
+ if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
106
+ target[key] = source[key];
107
+ }
108
+ }
109
+ return target;
110
+ }
111
+ function _object_without_properties_loose(source, excluded) {
112
+ if (source == null) return {};
113
+ var target = {};
114
+ var sourceKeys = Object.keys(source);
115
+ var key, i;
116
+ for(i = 0; i < sourceKeys.length; i++){
117
+ key = sourceKeys[i];
118
+ if (excluded.indexOf(key) >= 0) continue;
119
+ target[key] = source[key];
120
+ }
121
+ return target;
122
+ }
123
+ function _sliced_to_array(arr, i) {
124
+ return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
125
+ }
126
+ function _type_of(obj) {
127
+ "@swc/helpers - typeof";
128
+ return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
129
+ }
130
+ function _unsupported_iterable_to_array(o, minLen) {
131
+ if (!o) return;
132
+ if (typeof o === "string") return _array_like_to_array(o, minLen);
133
+ var n = Object.prototype.toString.call(o).slice(8, -1);
134
+ if (n === "Object" && o.constructor) n = o.constructor.name;
135
+ if (n === "Map" || n === "Set") return Array.from(n);
136
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
137
+ }
138
+ var __create = Object.create;
139
+ var __defProp = Object.defineProperty;
140
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
141
+ var __getOwnPropNames = Object.getOwnPropertyNames;
142
+ var __getProtoOf = Object.getPrototypeOf;
143
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
144
+ var __export = function(target, all) {
145
+ for(var name in all)__defProp(target, name, {
146
+ get: all[name],
147
+ enumerable: true
148
+ });
149
+ };
150
+ var __copyProps = function(to, from, except, desc) {
151
+ if (from && (typeof from === "undefined" ? "undefined" : _type_of(from)) === "object" || typeof from === "function") {
152
+ var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
153
+ try {
154
+ var _loop = function() {
155
+ var key = _step.value;
156
+ if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
157
+ get: function() {
158
+ return from[key];
159
+ },
160
+ enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
161
+ });
162
+ };
163
+ for(var _iterator = __getOwnPropNames(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true)_loop();
164
+ } catch (err) {
165
+ _didIteratorError = true;
166
+ _iteratorError = err;
167
+ } finally{
168
+ try {
169
+ if (!_iteratorNormalCompletion && _iterator.return != null) {
170
+ _iterator.return();
171
+ }
172
+ } finally{
173
+ if (_didIteratorError) {
174
+ throw _iteratorError;
175
+ }
176
+ }
177
+ }
178
+ }
179
+ return to;
180
+ };
181
+ var __toESM = function(mod, isNodeMode, target) {
182
+ return target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(// If the importer is in node compatibility mode or this is not an ESM
183
+ // file that has been converted to a CommonJS file using a Babel-
184
+ // compatible transform (i.e. "__esModule" has not been set), then set
185
+ // "default" to the CommonJS "module.exports" for node compatibility.
186
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
187
+ value: mod,
188
+ enumerable: true
189
+ }) : target, mod);
190
+ };
191
+ var __toCommonJS = function(mod) {
192
+ return __copyProps(__defProp({}, "__esModule", {
193
+ value: true
194
+ }), mod);
195
+ };
196
+ // src/index.ts
197
+ var index_exports = {};
198
+ __export(index_exports, {
199
+ MahatiButton: function() {
200
+ return Button;
201
+ },
202
+ MahatiCard: function() {
203
+ return Card;
204
+ },
205
+ MahatiDropdown: function() {
206
+ return Dropdown;
207
+ },
208
+ MahatiFormContainer: function() {
209
+ return FormContainer;
210
+ },
211
+ MahatiInput: function() {
212
+ return Input;
213
+ },
214
+ MahatiModal: function() {
215
+ return Modal;
216
+ },
217
+ MahatiTabbedInterface: function() {
218
+ return TabbedInterface;
219
+ },
220
+ MahatiTable: function() {
221
+ return Table;
222
+ },
223
+ MahatiTableTailwind: function() {
224
+ return TableTailwind;
225
+ },
226
+ MahatiTooltip: function() {
227
+ return Tooltip;
228
+ }
229
+ });
230
+ module.exports = __toCommonJS(index_exports);
231
+ // src/components/Button.tsx
232
+ var import_react = __toESM(require("react"));
233
+ var import_class_variance_authority = require("class-variance-authority");
234
+ // src/lib/utils.ts
235
+ var import_clsx = require("clsx");
236
+ var import_tailwind_merge = require("tailwind-merge");
237
+ function cn() {
238
+ for(var _len = arguments.length, inputs = new Array(_len), _key = 0; _key < _len; _key++){
239
+ inputs[_key] = arguments[_key];
240
+ }
241
+ return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
242
+ }
243
+ // src/components/Button.tsx
244
+ var buttonVariants = (0, import_class_variance_authority.cva)(// Use regular Tailwind classes that will be processed by consumer's Tailwind
245
+ "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", {
246
+ variants: {
247
+ variant: {
248
+ default: "bg-primary text-primary-foreground hover:bg-primary/90",
249
+ destructive: "purple",
250
+ outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
251
+ secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
252
+ ghost: "hover:bg-accent hover:text-accent-foreground",
253
+ link: "text-primary underline-offset-4 hover:underline"
254
+ },
255
+ size: {
256
+ default: "h-10 px-4 py-2",
257
+ sm: "h-9 rounded-md px-3",
258
+ lg: "h-11 rounded-md px-8",
259
+ icon: "h-10 w-10"
260
+ }
261
+ },
262
+ defaultVariants: {
263
+ variant: "default",
264
+ size: "default"
265
+ }
266
+ });
267
+ var Button = import_react.default.forwardRef(function(_param, ref) {
268
+ 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, [
269
+ "className",
270
+ "variant",
271
+ "size",
272
+ "asChild"
273
+ ]);
274
+ return /* @__PURE__ */ import_react.default.createElement("button", _object_spread({
275
+ className: cn(buttonVariants({
276
+ variant: variant,
277
+ size: size,
278
+ className: className
279
+ })),
280
+ ref: ref
281
+ }, props));
282
+ });
283
+ Button.displayName = "Button";
284
+ // src/components/Card.tsx
285
+ var React2 = __toESM(require("react"));
286
+ var import_class_variance_authority2 = require("class-variance-authority");
287
+ var import_lucide_react = require("lucide-react");
288
+ var cardVariants = (0, import_class_variance_authority2.cva)("rounded-[14px] transition-all duration-300 shadow-[0_4px_4px_0_rgba(0,0,0,0.25)]", {
289
+ variants: {
290
+ variant: {
291
+ default: "bg-white text-slate-800 border border-slate-200 hover:shadow-lg",
292
+ elevated: "bg-white shadow-md border border-transparent",
293
+ outline: "bg-slate-50 border border-slate-200",
294
+ subtle: "bg-slate-50 border border-transparent",
295
+ figma: ""
296
+ },
297
+ size: {
298
+ default: "p-6 rounded-[14px]",
299
+ sm: "p-4",
300
+ lg: "p-8",
301
+ figma: "w-[280px] p-6"
302
+ }
303
+ },
304
+ defaultVariants: {
305
+ variant: "default",
306
+ size: "default"
307
+ }
308
+ });
309
+ var Card = React2.forwardRef(function(_param, ref) {
310
+ 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, [
311
+ "title",
312
+ "cardContent",
313
+ "cardBackContent",
314
+ "collapsible",
315
+ "flippable",
316
+ "backgroundColor",
317
+ "borderRadius",
318
+ "variant",
319
+ "size",
320
+ "className",
321
+ "children",
322
+ "defaultOpen",
323
+ "onFlip",
324
+ "style"
325
+ ]);
326
+ var _React2_useState = _sliced_to_array(React2.useState(defaultOpen), 2), open = _React2_useState[0], setOpen = _React2_useState[1];
327
+ var _React2_useState1 = _sliced_to_array(React2.useState(false), 2), isFlipped = _React2_useState1[0], setIsFlipped = _React2_useState1[1];
328
+ var contentId = React2.useId();
329
+ var figmaStyles = variant === "figma" ? _object_spread({
330
+ backgroundColor: backgroundColor || "rgba(77, 175, 131, 0.10)",
331
+ border: "1px solid #1761A3",
332
+ boxShadow: "0 4px 4px 0 rgba(0, 0, 0, 0.25)",
333
+ borderRadius: "14px"
334
+ }, style) : backgroundColor ? _object_spread({
335
+ backgroundColor: backgroundColor
336
+ }, style) : style;
337
+ var handleFlip = function() {
338
+ if (!flippable) return;
339
+ var newFlippedState = !isFlipped;
340
+ setIsFlipped(newFlippedState);
341
+ onFlip === null || onFlip === void 0 ? void 0 : onFlip(newFlippedState);
342
+ };
343
+ var mainContent = cardContent || children;
344
+ return /* @__PURE__ */ React2.createElement("div", {
345
+ className: cn(flippable && "[perspective:1000px] group"),
346
+ onClick: handleFlip
347
+ }, /* @__PURE__ */ React2.createElement("div", _object_spread_props(_object_spread({
348
+ ref: ref
349
+ }, props), {
350
+ style: figmaStyles,
351
+ className: cn(cardVariants({
352
+ variant: variant,
353
+ size: size,
354
+ className: className
355
+ }), flippable && "relative transition-transform duration-700 [transform-style:preserve-3d]", flippable && isFlipped && "[transform:rotateY(180deg)]", className)
356
+ }), /* @__PURE__ */ React2.createElement("div", {
357
+ className: cn(flippable && "[backface-visibility:hidden]")
358
+ }, title && /* @__PURE__ */ React2.createElement("div", {
359
+ className: cn("flex items-center justify-between", {
360
+ "mb-4": open && mainContent
361
+ })
362
+ }, /* @__PURE__ */ React2.createElement("h4", {
363
+ className: "text-xl font-semibold text-slate-800"
364
+ }, title), collapsible && /* @__PURE__ */ React2.createElement("button", {
365
+ type: "button",
366
+ style: {
367
+ backgroundColor: "#1761A3"
368
+ },
369
+ 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",
370
+ onClick: function(e) {
371
+ if (flippable) e.stopPropagation();
372
+ setOpen(function(p) {
373
+ return !p;
374
+ });
375
+ },
376
+ "aria-label": open ? "Hide content" : "Show content",
377
+ "aria-expanded": open,
378
+ "aria-controls": contentId
379
+ }, open ? /* @__PURE__ */ React2.createElement(import_lucide_react.ChevronUp, {
380
+ className: "w-5 h-5 text-white"
381
+ }) : /* @__PURE__ */ React2.createElement(import_lucide_react.ChevronDown, {
382
+ className: "w-5 h-5 text-white"
383
+ }))), mainContent && /* @__PURE__ */ React2.createElement("div", {
384
+ id: contentId,
385
+ className: cn("grid overflow-hidden transition-all duration-500 ease-in-out", open ? "grid-rows-[1fr] opacity-100" : "grid-rows-[0fr] opacity-0")
386
+ }, /* @__PURE__ */ React2.createElement("div", {
387
+ className: "overflow-hidden"
388
+ }, mainContent))), flippable && cardBackContent && /* @__PURE__ */ React2.createElement("div", {
389
+ className: "absolute inset-0 w-full h-full p-6 [backface-visibility:hidden] [transform:rotateY(180deg)]"
390
+ }, cardBackContent)));
391
+ });
392
+ Card.displayName = "Card";
393
+ // src/components/Modal.tsx
394
+ var import_react2 = __toESM(require("react"));
395
+ var Modal = function(param) {
396
+ var isOpen = param.isOpen, onClose = param.onClose, title = param.title, children = param.children, className = param.className;
397
+ if (!isOpen) return null;
398
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
399
+ className: "fixed inset-0 z-50"
400
+ }, /* @__PURE__ */ import_react2.default.createElement("div", {
401
+ className: "fixed inset-0 bg-black bg-opacity-50 transition-opacity",
402
+ onClick: onClose
403
+ }), /* @__PURE__ */ import_react2.default.createElement("div", {
404
+ className: "fixed inset-0 overflow-y-auto"
405
+ }, /* @__PURE__ */ import_react2.default.createElement("div", {
406
+ className: "flex min-h-full items-center justify-center p-4"
407
+ }, /* @__PURE__ */ import_react2.default.createElement("div", {
408
+ 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),
409
+ onClick: function(e) {
410
+ return e.stopPropagation();
411
+ }
412
+ }, /* @__PURE__ */ import_react2.default.createElement("button", {
413
+ onClick: onClose,
414
+ className: "absolute right-4 top-4 text-gray-400 hover:text-gray-500"
415
+ }, /* @__PURE__ */ import_react2.default.createElement("span", {
416
+ className: "sr-only"
417
+ }, "Close"), /* @__PURE__ */ import_react2.default.createElement("svg", {
418
+ className: "h-6 w-6",
419
+ fill: "none",
420
+ viewBox: "0 0 24 24",
421
+ stroke: "currentColor"
422
+ }, /* @__PURE__ */ import_react2.default.createElement("path", {
423
+ strokeLinecap: "round",
424
+ strokeLinejoin: "round",
425
+ strokeWidth: 2,
426
+ d: "M6 18L18 6M6 6l12 12"
427
+ }))), title && /* @__PURE__ */ import_react2.default.createElement("div", {
428
+ className: "mb-4"
429
+ }, /* @__PURE__ */ import_react2.default.createElement("h3", {
430
+ className: "text-lg font-medium leading-6 text-gray-900"
431
+ }, title)), /* @__PURE__ */ import_react2.default.createElement("div", {
432
+ className: "mt-2 text-black"
433
+ }, children)))));
434
+ };
435
+ Modal.displayName = "Modal";
436
+ // src/components/FormContainer.tsx
437
+ var import_react3 = __toESM(require("react"));
438
+ var FormContainer = function(param) {
439
+ var children = param.children, onSubmit = param.onSubmit, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className;
440
+ return /* @__PURE__ */ import_react3.default.createElement("form", {
441
+ onSubmit: onSubmit,
442
+ 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 ")
443
+ }, children);
444
+ };
445
+ FormContainer.displayName = "FormContainer";
446
+ // src/components/Input.tsx
447
+ var import_react4 = __toESM(require("react"));
448
+ var Input = function(param) {
449
+ 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;
450
+ var _ref = _sliced_to_array((0, import_react4.useState)(value), 2), internalValue = _ref[0], setInternalValue = _ref[1];
451
+ var _ref1 = _sliced_to_array((0, import_react4.useState)(false), 2), showError = _ref1[0], setShowError = _ref1[1];
452
+ (0, import_react4.useEffect)(function() {
453
+ setInternalValue(value);
454
+ setShowError(hasError || value === "");
455
+ }, [
456
+ value,
457
+ hasError
458
+ ]);
459
+ var handleChange = function(e) {
460
+ var newValue = e.target.value;
461
+ setInternalValue(newValue);
462
+ onChange(e);
463
+ setShowError(newValue === "");
464
+ };
465
+ return /* @__PURE__ */ import_react4.default.createElement("div", {
466
+ className: "mb-4"
467
+ }, /* @__PURE__ */ import_react4.default.createElement("input", {
468
+ type: type,
469
+ name: name,
470
+ placeholder: placeholder,
471
+ value: internalValue,
472
+ onChange: handleChange,
473
+ 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 ")
474
+ }), /* @__PURE__ */ import_react4.default.createElement("span", {
475
+ className: "block text-sm text-red-500 h-[0.8rem]"
476
+ }, errorMessage));
477
+ };
478
+ Input.displayName = "Input";
479
+ // src/components/TabbedInterface.tsx
480
+ var import_react5 = __toESM(require("react"));
481
+ var TabbedInterface = function(param) {
482
+ 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;
483
+ var _tabs_activeTab;
484
+ var _ref = _sliced_to_array((0, import_react5.useState)(defaultActiveTab), 2), activeTab = _ref[0], setActiveTab = _ref[1];
485
+ var id = (0, import_react5.useId)();
486
+ var PRIMARY_COLOR = "#1e73be";
487
+ var ACCENT_COLOR = "#4DAF83";
488
+ var handleTabClick = function(index) {
489
+ var _tabs_index;
490
+ if ((_tabs_index = tabs[index]) === null || _tabs_index === void 0 ? void 0 : _tabs_index.disabled) return;
491
+ setActiveTab(index);
492
+ onTabChange === null || onTabChange === void 0 ? void 0 : onTabChange(index);
493
+ };
494
+ var getTabButtonStyles = function(index) {
495
+ var _tabs_index;
496
+ var isActive = index === activeTab;
497
+ 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";
498
+ var disabledStyles = "opacity-50 cursor-not-allowed";
499
+ if ((_tabs_index = tabs[index]) === null || _tabs_index === void 0 ? void 0 : _tabs_index.disabled) {
500
+ return "".concat(baseStyles, " ").concat(disabledStyles, " text-gray-500");
501
+ }
502
+ switch(variant){
503
+ case "basic":
504
+ 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");
505
+ case "underline":
506
+ return "".concat(baseStyles, " relative ").concat(isActive ? "text-[".concat(PRIMARY_COLOR, "]") : "text-gray-600 hover:text-gray-800");
507
+ case "pill":
508
+ 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"));
509
+ case "square":
510
+ 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");
511
+ case "dark":
512
+ 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");
513
+ case "shadow":
514
+ 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");
515
+ case "glass":
516
+ 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"));
517
+ case "gradient":
518
+ 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"));
519
+ default:
520
+ return "".concat(baseStyles, " ").concat(isActive ? "text-[".concat(PRIMARY_COLOR, "]") : "text-gray-600 hover:text-gray-800");
521
+ }
522
+ };
523
+ var getUnderlineBarClasses = function(index) {
524
+ var isActive = index === activeTab;
525
+ if (variant === "underline") {
526
+ 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");
527
+ }
528
+ return "hidden";
529
+ };
530
+ return /* @__PURE__ */ import_react5.default.createElement("div", {
531
+ className: "w-full bg-[#EEF4F7] rounded-lg border border-gray-200 shadow-sm ".concat(className)
532
+ }, /* @__PURE__ */ import_react5.default.createElement("div", {
533
+ className: "flex flex-row overflow-x-auto scrollbar-hide space-x-4 p-4",
534
+ role: "tablist"
535
+ }, tabs.map(function(tab, index) {
536
+ return /* @__PURE__ */ import_react5.default.createElement("button", {
537
+ key: tab.id || "tab-".concat(id, "-").concat(index),
538
+ className: getTabButtonStyles(index),
539
+ onClick: function() {
540
+ return handleTabClick(index);
541
+ },
542
+ disabled: tab.disabled,
543
+ "aria-selected": index === activeTab,
544
+ "aria-controls": "".concat(id, "-tabpanel-").concat(index),
545
+ role: "tab",
546
+ type: "button"
547
+ }, tab.icon && /* @__PURE__ */ import_react5.default.createElement("span", {
548
+ className: "flex-shrink-0 w-4 h-4"
549
+ }, tab.icon), /* @__PURE__ */ import_react5.default.createElement("span", {
550
+ className: "truncate"
551
+ }, tab.label), variant === "underline" && /* @__PURE__ */ import_react5.default.createElement("span", {
552
+ className: getUnderlineBarClasses(index)
553
+ }));
554
+ })), /* @__PURE__ */ import_react5.default.createElement("div", {
555
+ className: "h-[2px] flex-shrink-0 bg-[#D9D9D9]"
556
+ }), /* @__PURE__ */ import_react5.default.createElement("div", {
557
+ id: "".concat(id, "-tabpanel-").concat(activeTab),
558
+ role: "tabpanel",
559
+ "aria-labelledby": "".concat(id, "-tab-").concat(activeTab),
560
+ className: "p-6 animate-fade-in bg-white"
561
+ }, ((_tabs_activeTab = tabs[activeTab]) === null || _tabs_activeTab === void 0 ? void 0 : _tabs_activeTab.content) || /* @__PURE__ */ import_react5.default.createElement("div", {
562
+ className: "text-center text-gray-500 py-8"
563
+ }, "No content available for this tab")));
564
+ };
565
+ TabbedInterface.displayName = "TabbedInterface";
566
+ // src/components/Table.tsx
567
+ var import_react6 = __toESM(require("react"));
568
+ var import_outline = require("@heroicons/react/24/outline");
569
+ var Table = function(param) {
570
+ 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 ? [
571
+ "includes",
572
+ "startsWith"
573
+ ] : _param_searchModeOptions;
574
+ var _ref = _sliced_to_array((0, import_react6.useState)(searchModeOptions[0]), 2), searchMode = _ref[0], setSearchMode = _ref[1];
575
+ var isPaginated = paginationRequired;
576
+ var handleChange = function(e) {
577
+ onSearch === null || onSearch === void 0 ? void 0 : onSearch(e.target.value, searchMode);
578
+ };
579
+ var totalPages = isPaginated ? Math.max(1, Math.ceil((totalCount || 0) / (limit || 1))) : 0;
580
+ var currentPage = isPaginated ? typeof page === "number" && page > 0 ? page : 1 : 1;
581
+ var goToPage = function(p) {
582
+ if (!isPaginated) return;
583
+ var clamped = Math.max(1, Math.min(totalPages, p));
584
+ setPage === null || setPage === void 0 ? void 0 : setPage(clamped);
585
+ };
586
+ var renderPageNumbers = function() {
587
+ var _loop = function(i) {
588
+ pages.push(/* @__PURE__ */ import_react6.default.createElement("button", {
589
+ key: i,
590
+ onClick: function() {
591
+ return goToPage(i);
592
+ },
593
+ disabled: currentPage === i,
594
+ className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
595
+ style: {
596
+ background: currentPage === i ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
597
+ }
598
+ }, i));
599
+ };
600
+ if (!isPaginated || totalPages <= 1) return null;
601
+ var pages = [];
602
+ var siblings = 1;
603
+ pages.push(/* @__PURE__ */ import_react6.default.createElement("button", {
604
+ key: 1,
605
+ onClick: function() {
606
+ return goToPage(1);
607
+ },
608
+ disabled: currentPage === 1,
609
+ className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
610
+ style: {
611
+ background: currentPage === 1 ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
612
+ }
613
+ }, "1"));
614
+ if (currentPage > siblings + 2) {
615
+ pages.push(/* @__PURE__ */ import_react6.default.createElement("span", {
616
+ key: "start-ellipsis",
617
+ className: "px-1 text-sm text-slate-500"
618
+ }, "..."));
619
+ }
620
+ var start = Math.max(2, currentPage - siblings);
621
+ var end = Math.min(totalPages - 1, currentPage + siblings);
622
+ for(var i = start; i <= end; i++)_loop(i);
623
+ if (currentPage < totalPages - siblings - 1) {
624
+ pages.push(/* @__PURE__ */ import_react6.default.createElement("span", {
625
+ key: "end-ellipsis",
626
+ className: "px-1 text-sm text-slate-500"
627
+ }, "..."));
628
+ }
629
+ if (totalPages > 1) {
630
+ pages.push(/* @__PURE__ */ import_react6.default.createElement("button", {
631
+ key: totalPages,
632
+ onClick: function() {
633
+ return goToPage(totalPages);
634
+ },
635
+ disabled: currentPage === totalPages,
636
+ className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
637
+ style: {
638
+ background: currentPage === totalPages ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
639
+ }
640
+ }, totalPages));
641
+ }
642
+ return pages;
643
+ };
644
+ var renderPagination = function() {
645
+ if (!isPaginated) return null;
646
+ var align = paginationPosition.includes("left") ? "justify-start" : paginationPosition.includes("right") ? "justify-end" : "justify-center";
647
+ return /* @__PURE__ */ import_react6.default.createElement("div", {
648
+ className: "my-2 flex w-full ".concat(align)
649
+ }, /* @__PURE__ */ import_react6.default.createElement("div", {
650
+ className: "flex flex-wrap items-center justify-center gap-2"
651
+ }, /* @__PURE__ */ import_react6.default.createElement("button", {
652
+ onClick: function() {
653
+ return goToPage(currentPage - 1);
654
+ },
655
+ disabled: currentPage === 1,
656
+ className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
657
+ style: {
658
+ background: currentPage === 1 ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
659
+ }
660
+ }, "Previous"), renderPageNumbers(), /* @__PURE__ */ import_react6.default.createElement("button", {
661
+ onClick: function() {
662
+ return goToPage(currentPage + 1);
663
+ },
664
+ disabled: currentPage === totalPages,
665
+ className: "inline-flex items-center rounded-md px-3 py-1 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50",
666
+ style: {
667
+ background: currentPage === totalPages ? "#ccc" : "linear-gradient(to right, #1e73be, #28a97d)"
668
+ }
669
+ }, "Next"), /* @__PURE__ */ import_react6.default.createElement("select", {
670
+ value: limit,
671
+ onChange: function(e) {
672
+ setPage === null || setPage === void 0 ? void 0 : setPage(1);
673
+ setLimit === null || setLimit === void 0 ? void 0 : setLimit(Number(e.target.value));
674
+ },
675
+ className: "ml-2 rounded-md border border-slate-300 px-2 py-1 text-sm text-slate-700"
676
+ }, [
677
+ 5,
678
+ 10,
679
+ 15
680
+ ].map(function(size) {
681
+ return /* @__PURE__ */ import_react6.default.createElement("option", {
682
+ key: size,
683
+ value: size
684
+ }, size);
685
+ })), /* @__PURE__ */ import_react6.default.createElement("span", {
686
+ className: "ml-2 text-xs text-slate-600"
687
+ }, "Page ", currentPage, " of ", totalPages, " (Total: ", totalCount, " items)")));
688
+ };
689
+ return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, (searchable || onDownloadExcel || onDownloadPDF) && /* @__PURE__ */ import_react6.default.createElement("div", {
690
+ className: "mb-3 flex flex-wrap items-center justify-between gap-3"
691
+ }, searchable && /* @__PURE__ */ import_react6.default.createElement("div", {
692
+ className: "flex items-center gap-2"
693
+ }, /* @__PURE__ */ import_react6.default.createElement("div", {
694
+ className: "relative flex items-center"
695
+ }, /* @__PURE__ */ import_react6.default.createElement("input", {
696
+ type: "text",
697
+ placeholder: "Search...",
698
+ value: searchTerm,
699
+ onChange: handleChange,
700
+ 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"
701
+ }), searchTerm && /* @__PURE__ */ import_react6.default.createElement("button", {
702
+ onClick: onResetSearch,
703
+ "aria-label": "Clear search",
704
+ 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"
705
+ }, /* @__PURE__ */ import_react6.default.createElement(import_outline.XMarkIcon, {
706
+ className: "h-4 w-4"
707
+ }))), /* @__PURE__ */ import_react6.default.createElement("select", {
708
+ value: searchMode,
709
+ onChange: function(e) {
710
+ return setSearchMode(e.target.value);
711
+ },
712
+ 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"
713
+ }, searchModeOptions.map(function(mode) {
714
+ return /* @__PURE__ */ import_react6.default.createElement("option", {
715
+ key: mode,
716
+ value: mode
717
+ }, mode === "startsWith" ? "Starts With" : "Includes");
718
+ }))), (onDownloadPDF || onDownloadExcel) && /* @__PURE__ */ import_react6.default.createElement("div", {
719
+ className: "mt-1 flex items-center gap-2"
720
+ }, onDownloadPDF && /* @__PURE__ */ import_react6.default.createElement("button", {
721
+ onClick: function() {
722
+ return onDownloadPDF(data, headers);
723
+ },
724
+ className: "inline-flex items-center gap-1 rounded-md px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90",
725
+ style: {
726
+ background: "linear-gradient(to right, #1e73be, #28a97d)"
727
+ }
728
+ }, /* @__PURE__ */ import_react6.default.createElement(import_outline.ArrowDownOnSquareIcon, {
729
+ className: "h-5 w-5"
730
+ })), onDownloadExcel && /* @__PURE__ */ import_react6.default.createElement("button", {
731
+ onClick: function() {
732
+ return onDownloadExcel(data, headers);
733
+ },
734
+ className: "inline-flex items-center gap-1 rounded-md px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90",
735
+ style: {
736
+ background: "linear-gradient(to right, #1e73be, #28a97d)"
737
+ }
738
+ }, /* @__PURE__ */ import_react6.default.createElement(import_outline.ArrowDownOnSquareIcon, {
739
+ className: "h-5 w-5"
740
+ }), /* @__PURE__ */ import_react6.default.createElement("span", null, "Excel")))), paginationPosition.startsWith("top") && data.length > 0 && renderPagination(), /* @__PURE__ */ import_react6.default.createElement("div", {
741
+ className: "mt-1 overflow-hidden rounded-xl border border-[#1761A3] bg-white"
742
+ }, /* @__PURE__ */ import_react6.default.createElement("table", {
743
+ className: "w-full border-collapse"
744
+ }, /* @__PURE__ */ import_react6.default.createElement("thead", {
745
+ style: {
746
+ background: "linear-gradient(to right, #1e73be, #28a97d)"
747
+ }
748
+ }, /* @__PURE__ */ import_react6.default.createElement("tr", null, headers.map(function(header, idx) {
749
+ return /* @__PURE__ */ import_react6.default.createElement("th", {
750
+ key: idx,
751
+ className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white first:rounded-tl-xl last:rounded-tr-xl"
752
+ }, header.label);
753
+ }), actions && /* @__PURE__ */ import_react6.default.createElement("th", {
754
+ className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white"
755
+ }, "Actions"))), /* @__PURE__ */ import_react6.default.createElement("tbody", null, data.length > 0 ? data.map(function(row, rowIndex) {
756
+ return /* @__PURE__ */ import_react6.default.createElement("tr", {
757
+ key: rowIndex,
758
+ className: "h-[57px] border-b border-slate-200 text-sm text-slate-900 even:bg-slate-50 hover:bg-slate-100 ".concat(highlightRowColor || "")
759
+ }, headers.map(function(header, cellIdx) {
760
+ return /* @__PURE__ */ import_react6.default.createElement("td", {
761
+ key: cellIdx,
762
+ className: "px-3 py-2"
763
+ }, function() {
764
+ var value = row[header.key];
765
+ if (import_react6.default.isValidElement(value)) return value;
766
+ if (typeof value === "function") {
767
+ try {
768
+ var result = value();
769
+ if (import_react6.default.isValidElement(result)) return result;
770
+ } catch (e) {
771
+ console.warn("Error executing function in table cell:", e);
772
+ }
773
+ }
774
+ if (typeof value === "string" && value.trim().startsWith("<") && value.trim().endsWith(">")) {
775
+ return /* @__PURE__ */ import_react6.default.createElement("span", {
776
+ dangerouslySetInnerHTML: {
777
+ __html: value
778
+ }
779
+ });
780
+ }
781
+ if (Array.isArray(value)) {
782
+ if (value.some(function(item) {
783
+ return import_react6.default.isValidElement(item);
784
+ })) {
785
+ return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, value);
786
+ }
787
+ return value.join(", ");
788
+ }
789
+ if (_instanceof(value, Date)) return value.toLocaleString();
790
+ if (typeof value === "boolean") return value ? "Yes" : "No";
791
+ if (value === null || value === void 0) return "-";
792
+ if (typeof value === "number") return value.toString();
793
+ if ((typeof value === "undefined" ? "undefined" : _type_of(value)) === "object") return JSON.stringify(value);
794
+ return String(value);
795
+ }());
796
+ }), actions && /* @__PURE__ */ import_react6.default.createElement("td", {
797
+ className: "px-3 py-2"
798
+ }, actions(row)));
799
+ }) : /* @__PURE__ */ import_react6.default.createElement("tr", null, /* @__PURE__ */ import_react6.default.createElement("td", {
800
+ colSpan: headers.length + (actions ? 1 : 0),
801
+ className: "px-4 py-6 text-center text-slate-500"
802
+ }, /* @__PURE__ */ import_react6.default.createElement("div", {
803
+ className: "flex items-center justify-center gap-4"
804
+ }, /* @__PURE__ */ import_react6.default.createElement("span", null, "No records found."), onResetSearch && /* @__PURE__ */ import_react6.default.createElement("button", {
805
+ onClick: onResetSearch,
806
+ className: "inline-flex items-center gap-1 rounded-md px-3 py-2 text-sm font-medium text-white shadow-sm hover:opacity-90",
807
+ style: {
808
+ background: "linear-gradient(to right, #1e73be, #28a97d)"
809
+ }
810
+ }, /* @__PURE__ */ import_react6.default.createElement("span", null, "Reset"), /* @__PURE__ */ import_react6.default.createElement(import_outline.ArrowPathIcon, {
811
+ className: "h-5 w-5"
812
+ })))))))), paginationPosition.startsWith("bottom") && data.length > 0 && renderPagination());
813
+ };
814
+ Table.displayName = "Table";
815
+ // src/components/TableTailwindCSS.tsx
816
+ var import_react7 = __toESM(require("react"));
817
+ var import_outline2 = require("@heroicons/react/24/outline");
818
+ var TableTailwind = function(param) {
819
+ 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 ? [
820
+ "includes",
821
+ "startsWith"
822
+ ] : _param_searchModeOptions;
823
+ var _ref = _sliced_to_array((0, import_react7.useState)(searchModeOptions[0]), 2), searchMode = _ref[0], setSearchMode = _ref[1];
824
+ var isPaginated = paginationRequired;
825
+ var handleChange = function(e) {
826
+ onSearch === null || onSearch === void 0 ? void 0 : onSearch(e.target.value, searchMode);
827
+ };
828
+ var totalPages = isPaginated ? Math.max(1, Math.ceil((totalCount || 0) / (limit || 1))) : 0;
829
+ var currentPage = isPaginated ? typeof page === "number" && page > 0 ? page : 1 : 1;
830
+ var goToPage = function(p) {
831
+ if (!isPaginated) return;
832
+ var clamped = Math.max(1, Math.min(totalPages, p));
833
+ setPage === null || setPage === void 0 ? void 0 : setPage(clamped);
834
+ };
835
+ var renderPageNumbers = function() {
836
+ var _loop = function(i) {
837
+ pages.push(/* @__PURE__ */ import_react7.default.createElement("button", {
838
+ key: i,
839
+ onClick: function() {
840
+ return goToPage(i);
841
+ },
842
+ disabled: currentPage === i,
843
+ 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"
844
+ }, i));
845
+ };
846
+ if (!isPaginated || totalPages <= 1) return null;
847
+ var pages = [];
848
+ var siblings = 1;
849
+ pages.push(/* @__PURE__ */ import_react7.default.createElement("button", {
850
+ key: 1,
851
+ onClick: function() {
852
+ return goToPage(1);
853
+ },
854
+ disabled: currentPage === 1,
855
+ 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"
856
+ }, "1"));
857
+ if (currentPage > siblings + 2) {
858
+ pages.push(/* @__PURE__ */ import_react7.default.createElement("span", {
859
+ key: "start-ellipsis",
860
+ className: "px-1 text-sm text-slate-500"
861
+ }, "..."));
862
+ }
863
+ var start = Math.max(2, currentPage - siblings);
864
+ var end = Math.min(totalPages - 1, currentPage + siblings);
865
+ for(var i = start; i <= end; i++)_loop(i);
866
+ if (currentPage < totalPages - siblings - 1) {
867
+ pages.push(/* @__PURE__ */ import_react7.default.createElement("span", {
868
+ key: "end-ellipsis",
869
+ className: "px-1 text-sm text-slate-500"
870
+ }, "..."));
871
+ }
872
+ if (totalPages > 1) {
873
+ pages.push(/* @__PURE__ */ import_react7.default.createElement("button", {
874
+ key: totalPages,
875
+ onClick: function() {
876
+ return goToPage(totalPages);
877
+ },
878
+ disabled: currentPage === totalPages,
879
+ 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"
880
+ }, totalPages));
881
+ }
882
+ return pages;
883
+ };
884
+ var renderPagination = function() {
885
+ if (!isPaginated) return null;
886
+ var align = paginationPosition.includes("left") ? "justify-start" : paginationPosition.includes("right") ? "justify-end" : "justify-center";
887
+ return /* @__PURE__ */ import_react7.default.createElement("div", {
888
+ className: "my-2 flex w-full ".concat(align)
889
+ }, /* @__PURE__ */ import_react7.default.createElement("div", {
890
+ className: "flex flex-wrap items-center justify-center gap-2"
891
+ }, /* @__PURE__ */ import_react7.default.createElement("button", {
892
+ onClick: function() {
893
+ return goToPage(currentPage - 1);
894
+ },
895
+ disabled: currentPage === 1,
896
+ 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"
897
+ }, "Previous"), renderPageNumbers(), /* @__PURE__ */ import_react7.default.createElement("button", {
898
+ onClick: function() {
899
+ return goToPage(currentPage + 1);
900
+ },
901
+ disabled: currentPage === totalPages,
902
+ 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"
903
+ }, "Next"), /* @__PURE__ */ import_react7.default.createElement("select", {
904
+ value: limit,
905
+ onChange: function(e) {
906
+ setPage === null || setPage === void 0 ? void 0 : setPage(1);
907
+ setLimit === null || setLimit === void 0 ? void 0 : setLimit(Number(e.target.value));
908
+ },
909
+ className: "ml-2 rounded-md border border-slate-300 px-2 py-1 text-sm text-slate-700"
910
+ }, [
911
+ 5,
912
+ 10,
913
+ 15
914
+ ].map(function(size) {
915
+ return /* @__PURE__ */ import_react7.default.createElement("option", {
916
+ key: size,
917
+ value: size
918
+ }, size);
919
+ })), /* @__PURE__ */ import_react7.default.createElement("span", {
920
+ className: "ml-2 text-xs text-slate-600"
921
+ }, "Page ", currentPage, " of ", totalPages, " (Total: ", totalCount, " items)")));
922
+ };
923
+ return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, (searchable || onDownloadExcel || onDownloadPDF) && /* @__PURE__ */ import_react7.default.createElement("div", {
924
+ className: "mb-3 flex flex-wrap items-center justify-between gap-3"
925
+ }, searchable && /* @__PURE__ */ import_react7.default.createElement("div", {
926
+ className: "flex items-center gap-2"
927
+ }, /* @__PURE__ */ import_react7.default.createElement("div", {
928
+ className: "relative flex items-center"
929
+ }, /* @__PURE__ */ import_react7.default.createElement("input", {
930
+ type: "text",
931
+ placeholder: "Search...",
932
+ value: searchTerm,
933
+ onChange: handleChange,
934
+ 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"
935
+ }), searchTerm && /* @__PURE__ */ import_react7.default.createElement("button", {
936
+ onClick: onResetSearch,
937
+ "aria-label": "Clear search",
938
+ 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"
939
+ }, /* @__PURE__ */ import_react7.default.createElement(import_outline2.XMarkIcon, {
940
+ className: "h-4 w-4"
941
+ }))), /* @__PURE__ */ import_react7.default.createElement("select", {
942
+ value: searchMode,
943
+ onChange: function(e) {
944
+ return setSearchMode(e.target.value);
945
+ },
946
+ 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"
947
+ }, searchModeOptions.map(function(mode) {
948
+ return /* @__PURE__ */ import_react7.default.createElement("option", {
949
+ key: mode,
950
+ value: mode
951
+ }, mode === "startsWith" ? "Starts With" : "Includes");
952
+ }))), (onDownloadPDF || onDownloadExcel) && /* @__PURE__ */ import_react7.default.createElement("div", {
953
+ className: "mt-1 flex items-center gap-2"
954
+ }, onDownloadPDF && /* @__PURE__ */ import_react7.default.createElement("button", {
955
+ onClick: function() {
956
+ return onDownloadPDF(data, headers);
957
+ },
958
+ 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"
959
+ }, /* @__PURE__ */ import_react7.default.createElement(import_outline2.ArrowDownOnSquareIcon, {
960
+ className: "h-5 w-5"
961
+ })), onDownloadExcel && /* @__PURE__ */ import_react7.default.createElement("button", {
962
+ onClick: function() {
963
+ return onDownloadExcel(data, headers);
964
+ },
965
+ 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"
966
+ }, /* @__PURE__ */ import_react7.default.createElement(import_outline2.ArrowDownOnSquareIcon, {
967
+ className: "h-5 w-5"
968
+ }), /* @__PURE__ */ import_react7.default.createElement("span", null, "Excel")))), paginationPosition.startsWith("top") && data.length > 0 && renderPagination(), /* @__PURE__ */ import_react7.default.createElement("div", {
969
+ className: "mt-1 overflow-hidden rounded-xl border border-[#1761A3] bg-white"
970
+ }, /* @__PURE__ */ import_react7.default.createElement("table", {
971
+ className: "w-full border-collapse"
972
+ }, /* @__PURE__ */ import_react7.default.createElement("thead", {
973
+ className: "bg-gradient-to-r from-[#1e73be] to-[#28a97d]"
974
+ }, /* @__PURE__ */ import_react7.default.createElement("tr", null, headers.map(function(header, idx) {
975
+ return /* @__PURE__ */ import_react7.default.createElement("th", {
976
+ key: idx,
977
+ className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white first:rounded-tl-xl last:rounded-tr-xl"
978
+ }, header.label);
979
+ }), actions && /* @__PURE__ */ import_react7.default.createElement("th", {
980
+ className: "h-[50px] px-3 py-2 text-left text-sm font-bold text-white"
981
+ }, "Actions"))), /* @__PURE__ */ import_react7.default.createElement("tbody", null, data.length > 0 ? data.map(function(row, rowIndex) {
982
+ return /* @__PURE__ */ import_react7.default.createElement("tr", {
983
+ key: rowIndex,
984
+ className: "h-[57px] border-b border-slate-200 text-sm text-slate-900 even:bg-slate-50 hover:bg-slate-100 ".concat(highlightRowColor || "")
985
+ }, headers.map(function(header, cellIdx) {
986
+ return /* @__PURE__ */ import_react7.default.createElement("td", {
987
+ key: cellIdx,
988
+ className: "px-3 py-2"
989
+ }, function() {
990
+ var value = row[header.key];
991
+ if (import_react7.default.isValidElement(value)) return value;
992
+ if (typeof value === "function") {
993
+ try {
994
+ var result = value();
995
+ if (import_react7.default.isValidElement(result)) return result;
996
+ } catch (e) {
997
+ console.warn("Error executing function in table cell:", e);
998
+ }
999
+ }
1000
+ if (typeof value === "string" && value.trim().startsWith("<") && value.trim().endsWith(">")) {
1001
+ return /* @__PURE__ */ import_react7.default.createElement("span", {
1002
+ dangerouslySetInnerHTML: {
1003
+ __html: value
1004
+ }
1005
+ });
1006
+ }
1007
+ if (Array.isArray(value)) {
1008
+ if (value.some(function(item) {
1009
+ return import_react7.default.isValidElement(item);
1010
+ })) {
1011
+ return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, value);
1012
+ }
1013
+ return value.join(", ");
1014
+ }
1015
+ if (_instanceof(value, Date)) return value.toLocaleString();
1016
+ if (typeof value === "boolean") return value ? "Yes" : "No";
1017
+ if (value === null || value === void 0) return "-";
1018
+ if (typeof value === "number") return value.toString();
1019
+ if ((typeof value === "undefined" ? "undefined" : _type_of(value)) === "object") return JSON.stringify(value);
1020
+ return String(value);
1021
+ }());
1022
+ }), actions && /* @__PURE__ */ import_react7.default.createElement("td", {
1023
+ className: "px-3 py-2"
1024
+ }, actions(row)));
1025
+ }) : /* @__PURE__ */ import_react7.default.createElement("tr", null, /* @__PURE__ */ import_react7.default.createElement("td", {
1026
+ colSpan: headers.length + (actions ? 1 : 0),
1027
+ className: "px-4 py-6 text-center text-slate-500"
1028
+ }, /* @__PURE__ */ import_react7.default.createElement("div", {
1029
+ className: "flex items-center justify-center gap-4"
1030
+ }, /* @__PURE__ */ import_react7.default.createElement("span", null, "No records found."), onResetSearch && /* @__PURE__ */ import_react7.default.createElement("button", {
1031
+ onClick: onResetSearch,
1032
+ 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"
1033
+ }, /* @__PURE__ */ import_react7.default.createElement("span", null, "Reset"), /* @__PURE__ */ import_react7.default.createElement(import_outline2.ArrowPathIcon, {
1034
+ className: "h-5 w-5"
1035
+ })))))))), paginationPosition.startsWith("bottom") && data.length > 0 && renderPagination());
1036
+ };
1037
+ TableTailwind.displayName = "TableTailwind";
1038
+ // src/components/TooltipTailwindCSS.tsx
1039
+ var import_react8 = __toESM(require("react"));
1040
+ var Tooltip = function(param) {
1041
+ 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;
1042
+ var _ref = _sliced_to_array((0, import_react8.useState)(false), 2), visible = _ref[0], setVisible = _ref[1];
1043
+ var _ref1 = _sliced_to_array((0, import_react8.useState)(false), 2), showAnimation = _ref1[0], setShowAnimation = _ref1[1];
1044
+ var showTooltip = function() {
1045
+ setVisible(true);
1046
+ if (animation) {
1047
+ var delay = animation.triggerDelay || 100;
1048
+ setTimeout(function() {
1049
+ return setShowAnimation(true);
1050
+ }, delay);
1051
+ }
1052
+ };
1053
+ var hideTooltip = function() {
1054
+ setVisible(false);
1055
+ setShowAnimation(false);
1056
+ };
1057
+ var containerClasses = "relative inline-block ".concat(className);
1058
+ 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 ");
1059
+ 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 ");
1060
+ var positionClasses = {
1061
+ top: "bottom-full left-1/2 transform -translate-x-1/2 -translate-y-2 mb-2",
1062
+ right: "left-full top-1/2 transform -translate-y-1/2 translate-x-2 ml-2",
1063
+ bottom: "top-full left-1/2 transform -translate-x-1/2 translate-y-2 mt-2",
1064
+ left: "right-full top-1/2 transform -translate-y-1/2 -translate-x-2 mr-2"
1065
+ };
1066
+ var arrowBaseClasses = "absolute w-2 h-2 transform rotate-45";
1067
+ var arrowPositionClasses = {
1068
+ top: "bottom-[-4px] left-1/2 transform -translate-x-1/2",
1069
+ right: "left-[-4px] top-1/2 transform -translate-y-1/2",
1070
+ bottom: "top-[-4px] left-1/2 transform -translate-x-1/2",
1071
+ left: "right-[-4px] top-1/2 transform -translate-y-1/2"
1072
+ };
1073
+ var arrowBackgroundClass = "bg-[rgba(23,97,163,1)]";
1074
+ var tooltipClasses = variant === "transparent" ? "".concat(transparentTooltipClasses, " ").concat(positionClasses[position]) : "".concat(defaultTooltipClasses, " ").concat(positionClasses[position]);
1075
+ var renderTooltipContent = function() {
1076
+ if (image) {
1077
+ return /* @__PURE__ */ import_react8.default.createElement("img", {
1078
+ src: image.src,
1079
+ alt: image.alt || "Tooltip image",
1080
+ width: image.width || 200,
1081
+ height: image.height || 150,
1082
+ className: "rounded-md object-cover",
1083
+ loading: "lazy"
1084
+ });
1085
+ }
1086
+ return text;
1087
+ };
1088
+ var renderAnimation = function() {
1089
+ if (!animation || !showAnimation) return null;
1090
+ var AnimationComponent = animation.component;
1091
+ return /* @__PURE__ */ import_react8.default.createElement(AnimationComponent, _object_spread({
1092
+ isActive: showAnimation
1093
+ }, animation.props));
1094
+ };
1095
+ return /* @__PURE__ */ import_react8.default.createElement("div", {
1096
+ className: containerClasses,
1097
+ onMouseEnter: showTooltip,
1098
+ onMouseLeave: hideTooltip,
1099
+ onFocus: showTooltip,
1100
+ onBlur: hideTooltip
1101
+ }, children, renderAnimation(), /* @__PURE__ */ import_react8.default.createElement("div", {
1102
+ className: tooltipClasses,
1103
+ role: "tooltip"
1104
+ }, renderTooltipContent(), variant === "default" && !image && /* @__PURE__ */ import_react8.default.createElement("div", {
1105
+ className: "".concat(arrowBaseClasses, " ").concat(arrowPositionClasses[position], " ").concat(arrowBackgroundClass, " rounded-sm")
1106
+ })));
1107
+ };
1108
+ Tooltip.displayName = "Tooltip";
1109
+ // src/components/Dropdown.tsx
1110
+ var import_react9 = __toESM(require("react"));
1111
+ var variantStyles = {
1112
+ basic: "bg-blue-600 text-white hover:bg-blue-700",
1113
+ outline: "border border-blue-600 text-blue-600 hover:bg-blue-50",
1114
+ pill: "bg-blue-600 text-white rounded-full hover:bg-blue-700",
1115
+ dark: "bg-gray-800 text-white hover:bg-gray-700",
1116
+ underline: "border-b-2 border-blue-500 bg-transparent text-blue-700 hover:bg-blue-50",
1117
+ shadow: "bg-white text-gray-700 shadow-md hover:shadow-lg border border-gray-200",
1118
+ glass: "bg-white/20 backdrop-blur-md text-white border border-white/40 hover:bg-white/30",
1119
+ gradient: "bg-gradient-to-r from-blue-500 to-purple-500 text-white hover:opacity-90"
1120
+ };
1121
+ var Dropdown = function(param) {
1122
+ var options = param.options, onSelect = param.onSelect, _param_variant = param.variant, variant = _param_variant === void 0 ? "basic" : _param_variant;
1123
+ var _ref = _sliced_to_array((0, import_react9.useState)(false), 2), open = _ref[0], setOpen = _ref[1];
1124
+ var _ref1 = _sliced_to_array((0, import_react9.useState)(null), 2), selected = _ref1[0], setSelected = _ref1[1];
1125
+ var handleSelect = function(option) {
1126
+ setSelected(option);
1127
+ onSelect(option);
1128
+ setOpen(false);
1129
+ };
1130
+ return /* @__PURE__ */ import_react9.default.createElement("div", {
1131
+ className: "relative w-56"
1132
+ }, /* @__PURE__ */ import_react9.default.createElement("button", {
1133
+ onClick: function() {
1134
+ return setOpen(!open);
1135
+ },
1136
+ className: "w-full text-left px-4 py-2 rounded-md transition-all duration-200 ".concat(variantStyles[variant])
1137
+ }, selected || "Select an option"), open && /* @__PURE__ */ import_react9.default.createElement("div", {
1138
+ className: "absolute mt-2 w-full bg-white border border-gray-200 rounded-md shadow-lg z-20"
1139
+ }, options.map(function(opt, idx) {
1140
+ return /* @__PURE__ */ import_react9.default.createElement("div", {
1141
+ key: idx,
1142
+ onClick: function() {
1143
+ return handleSelect(opt);
1144
+ },
1145
+ className: "px-4 py-2 cursor-pointer hover:bg-gray-100 text-gray-700"
1146
+ }, opt);
1147
+ })));
1148
+ };
1149
+ Dropdown.displayName = "Dropdown";
1150
+ // Annotate the CommonJS export names for ESM import in node:
1151
+ 0 && (module.exports = {
1152
+ MahatiButton: MahatiButton,
1153
+ MahatiCard: MahatiCard,
1154
+ MahatiDropdown: MahatiDropdown,
1155
+ MahatiFormContainer: MahatiFormContainer,
1156
+ MahatiInput: MahatiInput,
1157
+ MahatiModal: MahatiModal,
1158
+ MahatiTabbedInterface: MahatiTabbedInterface,
1159
+ MahatiTable: MahatiTable,
1160
+ MahatiTableTailwind: MahatiTableTailwind,
1161
+ MahatiTooltip: MahatiTooltip
1162
+ });
1163
+ //# sourceMappingURL=index.js.map