jett.admin.npmpackage 1.0.19 → 1.0.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.css +1114 -1114
  2. package/dist/index.js +838 -838
  3. package/dist/index.mjs +789 -789
  4. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -1,789 +1,789 @@
1
- // src/utils/cn.ts
2
- import { clsx } from "clsx";
3
- import { twMerge } from "tailwind-merge";
4
- function cn(...inputs) {
5
- return twMerge(clsx(inputs));
6
- }
7
-
8
- // src/Button.jsx
9
- import React from "react";
10
- var variantStyles = {
11
- PRIMARY: "bg-white",
12
- SECONDARY: "bg-black text-white",
13
- DEFAULT: "bg-white text-black hover:bg-gray-100",
14
- DANGER: "bg-[#ef4444] text-white"
15
- };
16
- var CustomButton = ({
17
- variant,
18
- children,
19
- className,
20
- onClick,
21
- disabled = false,
22
- icon
23
- }) => {
24
- console.log(disabled);
25
- return /* @__PURE__ */ React.createElement(
26
- "div",
27
- {
28
- className: cn(
29
- `cursor-pointer flex items-center py-2 px-3 min-h-10 justify-center border rounded-[6px] border-[#e5e5e5] dark:border-[#303036] ${variant == "DANGER" ? "bg-[#ef4444]" : "dark:bg-[#1d1d20]"} gap-2`,
30
- variantStyles[variant],
31
- className
32
- ),
33
- onClick
34
- },
35
- icon && /* @__PURE__ */ React.createElement("div", null, icon),
36
- children
37
- );
38
- };
39
-
40
- // src/inputs/Autocomplete.jsx
41
- import React2, { useState, useRef } from "react";
42
- import { ChevronDown, Check, Search } from "lucide-react";
43
- var CustomAutocomplete = ({
44
- label,
45
- value,
46
- onChange,
47
- options,
48
- placeholder = "Search & select...",
49
- isRequired = false,
50
- error,
51
- heading,
52
- disabled = false
53
- }) => {
54
- const [open, setOpen] = useState(false);
55
- const [search, setSearch] = useState("");
56
- const wrapperRef = useRef(null);
57
- const selectedOptions = options.filter((opt) => value.includes(opt.value));
58
- const handleBlur = (e) => {
59
- var _a;
60
- if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
61
- setOpen(false);
62
- }
63
- };
64
- const filteredOptions = options.filter(
65
- (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
66
- );
67
- const toggleValue = (val) => {
68
- if (value.includes(val)) {
69
- onChange(value.filter((v) => v !== val));
70
- } else {
71
- onChange([...value, val]);
72
- }
73
- };
74
- return /* @__PURE__ */ React2.createElement(
75
- "div",
76
- {
77
- className: "flex flex-col w-full relative",
78
- ref: wrapperRef,
79
- tabIndex: disabled ? -1 : 0,
80
- onBlur: handleBlur
81
- },
82
- heading && /* @__PURE__ */ React2.createElement("h3", { className: "text-lg font-semibold leading-6 mb-1" }, heading),
83
- label && /* @__PURE__ */ React2.createElement(
84
- "label",
85
- {
86
- className: `font-[500] text-sm leading-5 mb-1 ${heading ? "text-[#737373]" : "text-black"}`
87
- },
88
- label,
89
- " ",
90
- isRequired && /* @__PURE__ */ React2.createElement("span", { className: "text-red-500" }, "*")
91
- ),
92
- /* @__PURE__ */ React2.createElement(
93
- "div",
94
- {
95
- onClick: () => {
96
- if (!disabled) setOpen((prev) => !prev);
97
- },
98
- className: `flex justify-between items-center flex-wrap gap-1 rounded-md px-3 py-2 text-sm transition border h-auto min-h-10
99
- ${disabled ? "bg-gray-100 cursor-not-allowed text-gray-400" : "cursor-text"}
100
- ${error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)] hover:border-gray-400"}
101
- `
102
- },
103
- /* @__PURE__ */ React2.createElement("div", { className: "flex flex-wrap gap-1 flex-1" }, selectedOptions.length > 0 ? selectedOptions.map((opt) => /* @__PURE__ */ React2.createElement(
104
- "span",
105
- {
106
- key: opt.value,
107
- className: "bg-gray-100 border border-gray-300 px-2 py-0.5 rounded text-xs flex items-center gap-1"
108
- },
109
- opt.label,
110
- /* @__PURE__ */ React2.createElement(
111
- "button",
112
- {
113
- onClick: (e) => {
114
- e.stopPropagation();
115
- toggleValue(opt.value);
116
- },
117
- className: "text-gray-500 hover:text-gray-700"
118
- },
119
- "\u2715"
120
- )
121
- )) : /* @__PURE__ */ React2.createElement("span", { className: "text-gray-400" }, placeholder)),
122
- /* @__PURE__ */ React2.createElement(
123
- ChevronDown,
124
- {
125
- className: `w-4 h-4 text-gray-500 transition-transform ${open ? "rotate-180" : ""}`
126
- }
127
- )
128
- ),
129
- !disabled && open && /* @__PURE__ */ React2.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto" }, /* @__PURE__ */ React2.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ React2.createElement(Search, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React2.createElement(
130
- "input",
131
- {
132
- type: "text",
133
- value: search,
134
- onChange: (e) => setSearch(e.target.value),
135
- placeholder: "Search...",
136
- className: "flex-1 text-sm focus:outline-none"
137
- }
138
- )), /* @__PURE__ */ React2.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => {
139
- const selected = value.includes(opt.value);
140
- return /* @__PURE__ */ React2.createElement(
141
- "li",
142
- {
143
- key: opt.value,
144
- onClick: () => toggleValue(opt.value),
145
- className: `flex items-center gap-2 px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 ${selected ? "bg-gray-50 font-medium" : ""}`
146
- },
147
- /* @__PURE__ */ React2.createElement(
148
- "span",
149
- {
150
- className: `w-4 h-4 flex items-center justify-center border rounded-sm ${selected ? "bg-blue-600 border-blue-600 text-white" : "border-gray-300"}`
151
- },
152
- selected && /* @__PURE__ */ React2.createElement(Check, { size: 14 })
153
- ),
154
- opt.label
155
- );
156
- }) : /* @__PURE__ */ React2.createElement("li", { className: "px-3 py-2 text-sm text-gray-400" }, "No results found")))
157
- );
158
- };
159
-
160
- // src/inputs/Checkbox.jsx
161
- import React3 from "react";
162
- var CustomCheckbox = ({ onChange, checked }) => {
163
- const handleChange = (e) => {
164
- onChange(e.target.checked);
165
- };
166
- return /* @__PURE__ */ React3.createElement("label", { className: "inline-flex items-center cursor-pointer select-none" }, /* @__PURE__ */ React3.createElement(
167
- "input",
168
- {
169
- type: "checkbox",
170
- checked,
171
- onChange: handleChange,
172
- className: "peer hidden"
173
- }
174
- ), /* @__PURE__ */ React3.createElement(
175
- "span",
176
- {
177
- className: "\r\n w-4 h-4 flex items-center justify-center border-2 border-gray-400 rounded \r\n peer-checked:bg-black peer-checked:border-black\r\n transition-colors\r\n "
178
- },
179
- checked && /* @__PURE__ */ React3.createElement(
180
- "svg",
181
- {
182
- className: "w-4 h-4 text-white",
183
- fill: "none",
184
- stroke: "currentColor",
185
- strokeWidth: "3",
186
- viewBox: "0 0 24 24"
187
- },
188
- /* @__PURE__ */ React3.createElement("path", { d: "M5 13l4 4L19 7" })
189
- )
190
- ));
191
- };
192
-
193
- // src/inputs/Chip.jsx
194
- import React4 from "react";
195
- var VARIANTS = {
196
- PRIMARY: "bg-gray-100 text-black",
197
- GREEN: "bg-green-100 text-green-800",
198
- RED: "bg-red-100 text-red-800",
199
- YELLOW: "bg-yellow-100 text-yellow-800"
200
- };
201
- var Chip = ({ label, variant }) => {
202
- return /* @__PURE__ */ React4.createElement(
203
- "div",
204
- {
205
- className: `inline-flex text-[12px] items-center px-3 py-1 rounded-full ${VARIANTS[variant] || VARIANTS.PRIMARY} text-sm font-[600]`
206
- },
207
- label
208
- );
209
- };
210
-
211
- // src/inputs/CustomSwitch.jsx
212
- import React5 from "react";
213
- var CustomSwitch = ({ checked, onChange, label, description }) => {
214
- return /* @__PURE__ */ React5.createElement("div", { className: "flex items-start gap-3 rounded-lg border border-gray-200 p-4 bg-white mb-4" }, /* @__PURE__ */ React5.createElement(
215
- "button",
216
- {
217
- type: "button",
218
- role: "switch",
219
- "aria-checked": checked,
220
- onClick: () => onChange(!checked),
221
- className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors ${checked ? "bg-black" : "bg-gray-300"}`
222
- },
223
- /* @__PURE__ */ React5.createElement(
224
- "span",
225
- {
226
- className: `inline-block h-4 w-4 transform rounded-full bg-white shadow transition ${checked ? "translate-x-6" : "translate-x-1"}`
227
- }
228
- )
229
- ), /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col" }, label && /* @__PURE__ */ React5.createElement("h3", { className: "font-[500] text-sm text-black mb-2" }, label), description && /* @__PURE__ */ React5.createElement("p", { className: "font-[500] text-sm text-[#737373]" }, description)));
230
- };
231
-
232
- // src/inputs/Input.jsx
233
- import React6 from "react";
234
- var CustomInput = ({
235
- label,
236
- isRequired,
237
- value,
238
- onChange,
239
- placeholder,
240
- disabled = false,
241
- error,
242
- heading
243
- }) => {
244
- return /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col gap-1 w-full" }, heading && /* @__PURE__ */ React6.createElement("h3", { className: "text-lg font-semibold" }, heading), /* @__PURE__ */ React6.createElement(
245
- "label",
246
- {
247
- className: `font-[500] text-sm ${heading ? "text-[#737373]" : "text-black"} dark:text-white`
248
- },
249
- label,
250
- " ",
251
- isRequired && /* @__PURE__ */ React6.createElement("span", { className: "text-red-500" }, "*")
252
- ), /* @__PURE__ */ React6.createElement(
253
- "input",
254
- {
255
- className: `border border-gray-200 rounded-md h-10 px-4 py-2 w-full text-[14px]
256
- focus:outline-2 outline-black dark:outline-white outline-offset-2
257
- dark:bg-transparent dark:text-white dark:border-[#303036]
258
- ${disabled ? "bg-gray-100 cursor-not-allowed text-gray-500 border-gray-300" : error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)]"}
259
- `,
260
- value,
261
- onChange: (e) => onChange == null ? void 0 : onChange(e.target.value),
262
- placeholder,
263
- disabled,
264
- readOnly: disabled
265
- }
266
- ));
267
- };
268
-
269
- // src/inputs/ProgressBar.jsx
270
- import React7 from "react";
271
- var ProgressBar = ({ step, totalSteps }) => {
272
- const progress = step / totalSteps * 100;
273
- return /* @__PURE__ */ React7.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React7.createElement("p", { className: "text-gray-600 text-sm mb-2" }, "Step ", step, " of ", totalSteps), /* @__PURE__ */ React7.createElement("div", { className: "w-full bg-gray-200 rounded-full h-2" }, /* @__PURE__ */ React7.createElement(
274
- "div",
275
- {
276
- className: "bg-black h-2 rounded-full transition-all duration-300",
277
- style: { width: `${progress}%` }
278
- }
279
- )));
280
- };
281
-
282
- // src/inputs/Search.jsx
283
- import React8 from "react";
284
- import { Search as Search2 } from "lucide-react";
285
- var CustomSearch = ({
286
- value,
287
- onChange,
288
- placeholder = "Search Markets..."
289
- }) => {
290
- return /* @__PURE__ */ React8.createElement("div", { className: "flex items-center border bg-transparent text-[14px] border-[hsl(0_0%_89.8%)] \r\n rounded-md h-10 px-2 w-full focus-within:outline-2 focus-within:outline-black focus-within:outline-offset-2" }, /* @__PURE__ */ React8.createElement(Search2, { width: 16, height: 16, color: "gray", className: "mr-2" }), /* @__PURE__ */ React8.createElement(
291
- "input",
292
- {
293
- type: "text",
294
- value,
295
- onChange,
296
- placeholder,
297
- className: "bg-transparent w-full h-full focus:outline-none"
298
- }
299
- ));
300
- };
301
-
302
- // src/inputs/TextArea.jsx
303
- import React9 from "react";
304
- var CustomTextarea = ({
305
- label,
306
- isRequired,
307
- value,
308
- onChange,
309
- placeholder,
310
- disabled = false,
311
- error,
312
- heading,
313
- rows = 4
314
- }) => {
315
- return /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col gap-1 w-full" }, heading && /* @__PURE__ */ React9.createElement("h3", { className: "text-lg font-semibold" }, heading), /* @__PURE__ */ React9.createElement(
316
- "label",
317
- {
318
- className: `font-[500] text-sm ${heading ? "text-[#737373]" : "text-black"}`
319
- },
320
- label,
321
- " ",
322
- isRequired && /* @__PURE__ */ React9.createElement("span", { className: "text-red-500" }, "*")
323
- ), /* @__PURE__ */ React9.createElement(
324
- "textarea",
325
- {
326
- rows,
327
- className: `border rounded-md px-4 py-2 w-full text-[14px]
328
- focus:outline-2 focus:outline-black focus:outline-offset-2
329
- focus:ring-0 focus:shadow-none focus:border-black
330
- ${disabled ? "bg-gray-100 text-gray-500 border-gray-300" : error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)]"}
331
- `,
332
- value,
333
- onChange: (e) => onChange == null ? void 0 : onChange(e.target.value),
334
- placeholder,
335
- disabled,
336
- readOnly: disabled
337
- }
338
- ));
339
- };
340
-
341
- // src/inputs/Upload.jsx
342
- import React10, { useRef as useRef2 } from "react";
343
- import { Upload } from "lucide-react";
344
- var CustomUpload = ({
345
- label = "Supporting documents",
346
- description = "Drop items here or Browse Files",
347
- accept = ".pdf,.jpg,.jpeg,.png",
348
- maxSizeMB = 5,
349
- onChange,
350
- error,
351
- value
352
- }) => {
353
- const inputRef = useRef2(null);
354
- const handleFileSelect = (files) => {
355
- if (!files || files.length === 0) return;
356
- const selectedFile = files[0];
357
- if (selectedFile.size > maxSizeMB * 1024 * 1024) {
358
- alert(`File size must be less than ${maxSizeMB} MB`);
359
- return;
360
- }
361
- onChange == null ? void 0 : onChange(selectedFile);
362
- };
363
- return /* @__PURE__ */ React10.createElement("div", { className: "flex flex-col gap-2 w-full" }, label && /* @__PURE__ */ React10.createElement("label", { className: "text-sm font-medium" }, label), /* @__PURE__ */ React10.createElement(
364
- "div",
365
- {
366
- className: `border-2 border-dashed rounded-lg p-6 flex flex-col items-center justify-center text-center cursor-pointer transition
367
- ${error ? "border-red-500 bg-red-50" : "border-gray-300 hover:border-gray-400 bg-gray-50"}`,
368
- onClick: () => {
369
- var _a;
370
- return (_a = inputRef.current) == null ? void 0 : _a.click();
371
- },
372
- onDragOver: (e) => e.preventDefault(),
373
- onDrop: (e) => {
374
- e.preventDefault();
375
- handleFileSelect(e.dataTransfer.files);
376
- }
377
- },
378
- /* @__PURE__ */ React10.createElement(Upload, { className: "w-6 h-6 text-gray-500 mb-2" }),
379
- /* @__PURE__ */ React10.createElement("p", { className: "text-sm text-gray-700" }, description),
380
- /* @__PURE__ */ React10.createElement("p", { className: "text-xs text-gray-500 mt-1" }, "File Supported: PDF/JPG/PNG, up to ", maxSizeMB, " MB"),
381
- /* @__PURE__ */ React10.createElement(
382
- "input",
383
- {
384
- ref: inputRef,
385
- type: "file",
386
- accept,
387
- className: "hidden",
388
- onChange: (e) => handleFileSelect(e.target.files)
389
- }
390
- )
391
- ), value && /* @__PURE__ */ React10.createElement("span", { className: "text-sm truncate text-gray-500" }, "Selected: ", value.name), error && /* @__PURE__ */ React10.createElement("p", { className: "text-xs text-red-500" }, error));
392
- };
393
-
394
- // src/sideBar/SideBar.jsx
395
- import { ChevronDown as ChevronDown2, Globe as Globe2, LogOut } from "lucide-react";
396
- import React11, { useEffect, useState as useState2 } from "react";
397
-
398
- // ConstantUI.js
399
- import { Home, BaggageClaim, Users, Banknote, Globe, TrendingUp, FileText, FileKey2, LifeBuoy, Cog, Building, Handshake, DollarSign } from "lucide-react";
400
- var navItemsConstant = [
401
- {
402
- Icon: Home,
403
- label: "Home",
404
- onClick: () => {
405
- window.location.href = "/";
406
- },
407
- isDropDown: false
408
- },
409
- {
410
- Icon: Handshake,
411
- label: "Supplier Ecosystem",
412
- onClick: () => {
413
- },
414
- isDropDown: true,
415
- options: [
416
- { label: "Suppliers", onClick: () => {
417
- window.location.href = "/supplier/";
418
- } }
419
- ]
420
- },
421
- {
422
- Icon: Building,
423
- label: "Consumer Ecosystem",
424
- onClick: () => {
425
- },
426
- options: [
427
- {
428
- label: "Corporate",
429
- onClick: () => {
430
- window.location.href = "/corporate/";
431
- }
432
- },
433
- { label: "Trips", onClick: () => {
434
- window.location.href = "/trips/";
435
- } },
436
- { label: "Reports", onClick: () => {
437
- window.location.href = "/reports/";
438
- } },
439
- {
440
- label: "Tags",
441
- onClick: () => {
442
- window.location.href = "/tags/";
443
- }
444
- }
445
- ],
446
- isDropDown: true
447
- },
448
- {
449
- Icon: Banknote,
450
- label: "Finance",
451
- onClick: () => {
452
- },
453
- isDropDown: true,
454
- options: [
455
- { label: "Invoices", onClick: () => {
456
- window.location.href = "/invoices/";
457
- } },
458
- { label: "Ledger", onClick: () => {
459
- window.location.href = "/ledger/";
460
- } },
461
- { label: "Payments", onClick: () => {
462
- window.location.href = "/payments/";
463
- } }
464
- ]
465
- },
466
- {
467
- Icon: DollarSign,
468
- label: "Revenue Management",
469
- onClick: () => {
470
- },
471
- isDropDown: true,
472
- options: [
473
- {
474
- label: "Pricing Policy",
475
- onClick: () => {
476
- window.location.href = "/pricing/";
477
- }
478
- },
479
- { label: "Offers", onClick: () => {
480
- window.location.href = "/offers/";
481
- } },
482
- { label: "Vouchers", onClick: () => {
483
- window.location.href = "/vouchers/";
484
- } },
485
- { label: "Supplier Deals", onClick: () => {
486
- window.location.href = "/supplierdeals/";
487
- } },
488
- {
489
- label: "Subscription Plans",
490
- onClick: () => {
491
- window.location.href = "/subscription/";
492
- }
493
- }
494
- ]
495
- },
496
- {
497
- Icon: Cog,
498
- label: "Settings",
499
- onClick: () => {
500
- },
501
- isDropDown: true,
502
- options: [
503
- {
504
- label: "Admin user Management",
505
- isDropDown: true,
506
- onClick: () => {
507
- },
508
- options: [
509
- { label: "Admin Users", onClick: () => {
510
- window.location.href = "/users/";
511
- } },
512
- { label: "Admin User Attributes", onClick: () => {
513
- } }
514
- ]
515
- },
516
- { label: "TMC Markets", onClick: () => {
517
- window.location.href = "/market/";
518
- } },
519
- { label: "Permissions", onClick: () => {
520
- window.location.href = "/permissions/";
521
- } },
522
- { label: "Report Configurations", onClick: () => {
523
- window.location.href = "/reports/";
524
- } },
525
- { label: "Whitelabelling", onClick: () => {
526
- window.location.href = "/whitelabelling/";
527
- } }
528
- ]
529
- }
530
- ];
531
- var additionalItemsConstant = [
532
- { Icon: LifeBuoy, label: "Help", onClick: () => {
533
- window.location.href = "/help";
534
- } }
535
- ];
536
-
537
- // src/assests/logo/sidebarlogo.webp
538
- var sidebarlogo_default = "./sidebarlogo-S4TNJORM.webp";
539
-
540
- // src/sideBar/SideBar.jsx
541
- var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) => {
542
- var _a, _b;
543
- const [authData, setAuthData] = useState2(null);
544
- const handleIconRotate = (e, index, additionalKey) => {
545
- let dropDownIcon = e.currentTarget.children[2];
546
- if (!dropDownIcon) return;
547
- if (dropDownIcon.classList.contains("rotate-180")) {
548
- dropDownIcon.classList.remove("rotate-180");
549
- } else {
550
- dropDownIcon.classList.add("transition-all");
551
- dropDownIcon.classList.add("rotate-180");
552
- }
553
- const optionsContainer = document.getElementById(`dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}`);
554
- if (!optionsContainer) return;
555
- optionsContainer.classList.add("transition-all");
556
- if (optionsContainer.classList.contains("max-h-0")) {
557
- optionsContainer.classList.remove("max-h-0");
558
- optionsContainer.classList.add("min-h-[50px]");
559
- } else {
560
- optionsContainer.classList.remove("min-h-[50px]");
561
- optionsContainer.classList.add("max-h-0");
562
- }
563
- };
564
- const checkForAuthData = () => {
565
- const params = new URLSearchParams(window.location.search);
566
- let authData2 = params.get("authData");
567
- if (authData2) {
568
- authData2 = atob(authData2);
569
- localStorage.setItem("authData", authData2);
570
- setAuthData(JSON.parse(authData2));
571
- params.delete("authData");
572
- const newUrl = window.location.pathname + (params.toString() ? "?" + params.toString() : "");
573
- window.history.replaceState({}, document.title, newUrl);
574
- }
575
- };
576
- useEffect(() => {
577
- checkForAuthData();
578
- }, []);
579
- useEffect(() => {
580
- const storedAuthData = localStorage.getItem("authData");
581
- if (storedAuthData) {
582
- let parseData = JSON.parse(storedAuthData);
583
- setAuthData(parseData);
584
- }
585
- }, [localStorage.getItem("authData")]);
586
- const navItemsLocal = navItems ?? navItemsConstant;
587
- const additionalItemsLocal = additionalItems ?? additionalItemsConstant;
588
- const sideBarLogoLocal = sideBarLogo ?? sidebarlogo_default;
589
- return /* @__PURE__ */ React11.createElement("div", { className: "w-[320px] transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 h-full max-h-[100vh]" }, /* @__PURE__ */ React11.createElement("div", { className: "p-2 mb-4" }, /* @__PURE__ */ React11.createElement("div", { className: "w-[108px] h-[40px] flex items-center \r\n justify-center" }, /* @__PURE__ */ React11.createElement("img", { src: sideBarLogoLocal, alt: "sidebarLogo", width: 108, height: 40 }))), /* @__PURE__ */ React11.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React11.createElement("div", { className: "flex ml-[20px] items-center gap-2 mb-2 dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React11.createElement(Globe2, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("h3", { className: "text-[#3f3f46cc] dark:text-[#f4f4f5cc] font-medium" }, "Data Centers")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement(CustomAutocomplete, { options: [] }))), /* @__PURE__ */ React11.createElement("div", { className: "overflow-y-auto" }, /* @__PURE__ */ React11.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
590
- return /* @__PURE__ */ React11.createElement("div", { key: index, className: "" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer rounded-lg ml-2", onClick: (e) => {
591
- item.onClick && item.onClick(e);
592
- handleIconRotate(e, index);
593
- } }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, item.label), item.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))), item.options && item.options.length > 0 && /* @__PURE__ */ React11.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${index}` }, item.options.map((options, optionsIndex) => {
594
- return /* @__PURE__ */ React11.createElement("div", { className: "" }, /* @__PURE__ */ React11.createElement(
595
- "div",
596
- {
597
- className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] cursor-pointer",
598
- onClick: (e) => {
599
- options.onClick && options.onClick();
600
- options.isDropDown && handleIconRotate(e, optionsIndex, "subOption");
601
- }
602
- },
603
- /* @__PURE__ */ React11.createElement("div", null),
604
- /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-sm text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, options.label),
605
- options.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))
606
- ), options.options && options.options.length > 1 && /* @__PURE__ */ React11.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${optionsIndex}-subOption` }, options.options.map((subOption) => {
607
- return /* @__PURE__ */ React11.createElement(
608
- "div",
609
- {
610
- className: "p-2 rounded-lg hover:bg-gray-100 text-[#3f3f46cc] dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] font-medium text-sm",
611
- onClick: (e) => {
612
- subOption.onClick && subOption.onClick();
613
- }
614
- },
615
- subOption.label
616
- );
617
- })));
618
- })));
619
- })), /* @__PURE__ */ React11.createElement("div", { className: "border-t border-[#e5e5e5] dark:border-[#303036] mt-4" }, (additionalItemsLocal == null ? void 0 : additionalItemsLocal.length) > 0 && additionalItemsLocal.map((item, index) => {
620
- return /* @__PURE__ */ React11.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, item.label));
621
- }))), /* @__PURE__ */ React11.createElement("div", { className: "mt-auto bg-[#fafafa] dark:bg-transparent sticky bottom-0 pt-2" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between p-2 rounded-lg hover:bg-[#f4f4f5] dark:hover:bg-[#27272a] cursor-pointer", onClick: () => {
622
- window.location.href = "/profile";
623
- } }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("span", { className: "relative flex shrink-0 overflow-hidden rounded-full h-10 w-10" }, /* @__PURE__ */ React11.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted" }, ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.UserName) ? authData.userInfo.UserName.split("")[0] : "A")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "font-semibold" }, ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.UserName) ? authData.userInfo.UserName : "Admin User"), /* @__PURE__ */ React11.createElement("p", { className: "text-sm text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, role))), /* @__PURE__ */ React11.createElement("div", { className: "text-[#18181b] dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React11.createElement(LogOut, null)))));
624
- };
625
-
626
- // src/RightSheet/RightSheet.jsx
627
- import React12, { useEffect as useEffect2, useState as useState3 } from "react";
628
- var RightSheet = ({
629
- open,
630
- setOpen,
631
- children,
632
- callBack,
633
- actionLabel = "Save",
634
- onAction = () => {
635
- }
636
- }) => {
637
- const [visible, setVisible] = useState3(open);
638
- useEffect2(() => {
639
- if (open) {
640
- document.body.style.overflow = "hidden";
641
- setVisible(true);
642
- }
643
- return () => {
644
- document.body.style.overflow = "auto";
645
- };
646
- }, [open]);
647
- const handleClose = () => {
648
- setVisible(false);
649
- setTimeout(() => {
650
- setOpen(false);
651
- callBack();
652
- }, 200);
653
- };
654
- const handleAction = () => {
655
- onAction();
656
- handleClose();
657
- };
658
- if (!visible) return null;
659
- return /* @__PURE__ */ React12.createElement(
660
- "div",
661
- {
662
- className: "fixed inset-0 overflow-x-hidden bg-black/80 sheetPopIn h-full overflow-auto ",
663
- onClick: handleClose
664
- },
665
- /* @__PURE__ */ React12.createElement(
666
- "div",
667
- {
668
- className: `absolute flex flex-col right-0 top-0 min-h-full min-w-[100%] md:min-w-[576px] bg-white
669
- ${visible ? "sheetRightSlide" : "transition-all duration-200 translate-x-[100%]"} justify-between `,
670
- onClick: (e) => e.stopPropagation()
671
- },
672
- /* @__PURE__ */ React12.createElement("div", { className: "bg-white min-h-full " }, children),
673
- /* @__PURE__ */ React12.createElement("div", { className: "h-[90px] flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 p-6 border-t sticky bottom-0 bg-white border-[#e6e6e6]" }, /* @__PURE__ */ React12.createElement(CustomButton, { variant: "SECONDARY", onClick: () => handleClose() }, "Cancel"), /* @__PURE__ */ React12.createElement(CustomButton, { variant: "SECONDARY", onClick: handleAction }, actionLabel))
674
- )
675
- );
676
- };
677
-
678
- // src/Table/CustomTable.jsx
679
- import React13 from "react";
680
- var CustomTable = ({ tableHeader, setIsAllChecked, isAllChecked, children }) => {
681
- return /* @__PURE__ */ React13.createElement("div", { className: "border border-[#e5e5e5] rounded-lg overflow-x-auto" }, /* @__PURE__ */ React13.createElement("div", { className: "w-full relative overflow-x-auto" }, /* @__PURE__ */ React13.createElement("table", { className: "w-full caption-bottom text-sm overflow-x-auto bg-white table-fixed border-collapse" }, /* @__PURE__ */ React13.createElement("thead", { className: "border-b border-[#e5e5e5]" }, /* @__PURE__ */ React13.createElement("tr", { className: "transition-colors text-[#737373] hover:bg-muted/50 \r\n data-[state=selected]:bg-muted" }, /* @__PURE__ */ React13.createElement("th", { className: "px-4 py-3 text-left w-[50px]" }, /* @__PURE__ */ React13.createElement(CustomCheckbox, { checked: isAllChecked, onChange: () => {
682
- setIsAllChecked(!isAllChecked);
683
- } })), tableHeader.map((header, index) => {
684
- return /* @__PURE__ */ React13.createElement("th", { className: `px-4 py-3 text-sm font-medium ${index == tableHeader.length - 1 ? "text-right" : "text-left"}`, key: header + index }, header);
685
- }))), /* @__PURE__ */ React13.createElement("tbody", null, children))));
686
- };
687
-
688
- // src/inputs/CustomSelect.jsx
689
- import React14, { useState as useState4, useRef as useRef3 } from "react";
690
- import { ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
691
- var CustomSelect = ({
692
- label,
693
- value,
694
- onChange,
695
- options,
696
- placeholder = "Select...",
697
- isRequired = false,
698
- error,
699
- heading,
700
- disabled = false
701
- }) => {
702
- const [open, setOpen] = useState4(false);
703
- const [search, setSearch] = useState4("");
704
- const wrapperRef = useRef3(null);
705
- const handleBlur = (e) => {
706
- var _a;
707
- if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
708
- setOpen(false);
709
- }
710
- };
711
- const filteredOptions = options.filter(
712
- (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
713
- );
714
- const handleSelect = (val) => {
715
- onChange(val);
716
- setOpen(false);
717
- };
718
- const selectedOption = options.find((opt) => opt.value === value);
719
- return /* @__PURE__ */ React14.createElement(
720
- "div",
721
- {
722
- className: "flex flex-col w-full relative",
723
- ref: wrapperRef,
724
- tabIndex: disabled ? -1 : 0,
725
- onBlur: handleBlur
726
- },
727
- heading && /* @__PURE__ */ React14.createElement("h3", { className: "text-lg font-semibold mb-1" }, heading),
728
- label && /* @__PURE__ */ React14.createElement(
729
- "label",
730
- {
731
- className: `font-medium text-sm mb-1 ${heading ? "text-gray-500" : "text-black"}`
732
- },
733
- label,
734
- " ",
735
- isRequired && /* @__PURE__ */ React14.createElement("span", { className: "text-red-500" }, "*")
736
- ),
737
- /* @__PURE__ */ React14.createElement(
738
- "div",
739
- {
740
- onClick: () => !disabled && setOpen((prev) => !prev),
741
- className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer
742
- ${disabled ? "bg-gray-100 text-gray-400" : "bg-white hover:border-gray-400"}
743
- ${error ? "border-red-500" : "border-gray-300"}
744
- `
745
- },
746
- /* @__PURE__ */ React14.createElement("span", { className: `${selectedOption ? "text-black" : "text-gray-400"}` }, selectedOption ? selectedOption.label : placeholder),
747
- /* @__PURE__ */ React14.createElement(
748
- ChevronDown3,
749
- {
750
- className: `w-4 h-4 text-gray-500 transition-transform ${open ? "rotate-180" : ""}`
751
- }
752
- )
753
- ),
754
- open && !disabled && /* @__PURE__ */ React14.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto" }, /* @__PURE__ */ React14.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ React14.createElement(Search3, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React14.createElement(
755
- "input",
756
- {
757
- type: "text",
758
- value: search,
759
- onChange: (e) => setSearch(e.target.value),
760
- placeholder: "Search...",
761
- className: "flex-1 text-sm focus:outline-none"
762
- }
763
- )), /* @__PURE__ */ React14.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ React14.createElement(
764
- "li",
765
- {
766
- key: opt.value,
767
- onClick: () => handleSelect(opt.value),
768
- className: `px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 ${value === opt.value ? "bg-gray-100 font-medium" : ""}`
769
- },
770
- opt.label
771
- )) : /* @__PURE__ */ React14.createElement("li", { className: "px-3 py-2 text-sm text-gray-400" }, "No results found")))
772
- );
773
- };
774
- export {
775
- AppSideBar,
776
- Chip,
777
- CustomAutocomplete,
778
- CustomButton,
779
- CustomCheckbox,
780
- CustomInput,
781
- CustomSearch,
782
- CustomSelect,
783
- CustomSwitch,
784
- CustomTable,
785
- CustomTextarea,
786
- CustomUpload,
787
- ProgressBar,
788
- RightSheet
789
- };
1
+ // src/utils/cn.ts
2
+ import { clsx } from "clsx";
3
+ import { twMerge } from "tailwind-merge";
4
+ function cn(...inputs) {
5
+ return twMerge(clsx(inputs));
6
+ }
7
+
8
+ // src/Button.jsx
9
+ import React from "react";
10
+ var variantStyles = {
11
+ PRIMARY: "bg-white",
12
+ SECONDARY: "bg-black text-white",
13
+ DEFAULT: "bg-white text-black hover:bg-gray-100",
14
+ DANGER: "bg-[#ef4444] text-white"
15
+ };
16
+ var CustomButton = ({
17
+ variant,
18
+ children,
19
+ className,
20
+ onClick,
21
+ disabled = false,
22
+ icon
23
+ }) => {
24
+ console.log(disabled);
25
+ return /* @__PURE__ */ React.createElement(
26
+ "div",
27
+ {
28
+ className: cn(
29
+ `cursor-pointer flex items-center py-2 px-3 min-h-10 justify-center border rounded-[6px] border-[#e5e5e5] dark:border-[#303036] ${variant == "DANGER" ? "bg-[#ef4444]" : "dark:bg-[#1d1d20]"} gap-2`,
30
+ variantStyles[variant],
31
+ className
32
+ ),
33
+ onClick
34
+ },
35
+ icon && /* @__PURE__ */ React.createElement("div", null, icon),
36
+ children
37
+ );
38
+ };
39
+
40
+ // src/inputs/Autocomplete.jsx
41
+ import React2, { useState, useRef } from "react";
42
+ import { ChevronDown, Check, Search } from "lucide-react";
43
+ var CustomAutocomplete = ({
44
+ label,
45
+ value,
46
+ onChange,
47
+ options,
48
+ placeholder = "Search & select...",
49
+ isRequired = false,
50
+ error,
51
+ heading,
52
+ disabled = false
53
+ }) => {
54
+ const [open, setOpen] = useState(false);
55
+ const [search, setSearch] = useState("");
56
+ const wrapperRef = useRef(null);
57
+ const selectedOptions = options.filter((opt) => value.includes(opt.value));
58
+ const handleBlur = (e) => {
59
+ var _a;
60
+ if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
61
+ setOpen(false);
62
+ }
63
+ };
64
+ const filteredOptions = options.filter(
65
+ (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
66
+ );
67
+ const toggleValue = (val) => {
68
+ if (value.includes(val)) {
69
+ onChange(value.filter((v) => v !== val));
70
+ } else {
71
+ onChange([...value, val]);
72
+ }
73
+ };
74
+ return /* @__PURE__ */ React2.createElement(
75
+ "div",
76
+ {
77
+ className: "flex flex-col w-full relative",
78
+ ref: wrapperRef,
79
+ tabIndex: disabled ? -1 : 0,
80
+ onBlur: handleBlur
81
+ },
82
+ heading && /* @__PURE__ */ React2.createElement("h3", { className: "text-lg font-semibold leading-6 mb-1" }, heading),
83
+ label && /* @__PURE__ */ React2.createElement(
84
+ "label",
85
+ {
86
+ className: `font-[500] text-sm leading-5 mb-1 ${heading ? "text-[#737373]" : "text-black"}`
87
+ },
88
+ label,
89
+ " ",
90
+ isRequired && /* @__PURE__ */ React2.createElement("span", { className: "text-red-500" }, "*")
91
+ ),
92
+ /* @__PURE__ */ React2.createElement(
93
+ "div",
94
+ {
95
+ onClick: () => {
96
+ if (!disabled) setOpen((prev) => !prev);
97
+ },
98
+ className: `flex justify-between items-center flex-wrap gap-1 rounded-md px-3 py-2 text-sm transition border h-auto min-h-10
99
+ ${disabled ? "bg-gray-100 cursor-not-allowed text-gray-400" : "cursor-text"}
100
+ ${error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)] hover:border-gray-400"}
101
+ `
102
+ },
103
+ /* @__PURE__ */ React2.createElement("div", { className: "flex flex-wrap gap-1 flex-1" }, selectedOptions.length > 0 ? selectedOptions.map((opt) => /* @__PURE__ */ React2.createElement(
104
+ "span",
105
+ {
106
+ key: opt.value,
107
+ className: "bg-gray-100 border border-gray-300 px-2 py-0.5 rounded text-xs flex items-center gap-1"
108
+ },
109
+ opt.label,
110
+ /* @__PURE__ */ React2.createElement(
111
+ "button",
112
+ {
113
+ onClick: (e) => {
114
+ e.stopPropagation();
115
+ toggleValue(opt.value);
116
+ },
117
+ className: "text-gray-500 hover:text-gray-700"
118
+ },
119
+ "\u2715"
120
+ )
121
+ )) : /* @__PURE__ */ React2.createElement("span", { className: "text-gray-400" }, placeholder)),
122
+ /* @__PURE__ */ React2.createElement(
123
+ ChevronDown,
124
+ {
125
+ className: `w-4 h-4 text-gray-500 transition-transform ${open ? "rotate-180" : ""}`
126
+ }
127
+ )
128
+ ),
129
+ !disabled && open && /* @__PURE__ */ React2.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto" }, /* @__PURE__ */ React2.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ React2.createElement(Search, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React2.createElement(
130
+ "input",
131
+ {
132
+ type: "text",
133
+ value: search,
134
+ onChange: (e) => setSearch(e.target.value),
135
+ placeholder: "Search...",
136
+ className: "flex-1 text-sm focus:outline-none"
137
+ }
138
+ )), /* @__PURE__ */ React2.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => {
139
+ const selected = value.includes(opt.value);
140
+ return /* @__PURE__ */ React2.createElement(
141
+ "li",
142
+ {
143
+ key: opt.value,
144
+ onClick: () => toggleValue(opt.value),
145
+ className: `flex items-center gap-2 px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 ${selected ? "bg-gray-50 font-medium" : ""}`
146
+ },
147
+ /* @__PURE__ */ React2.createElement(
148
+ "span",
149
+ {
150
+ className: `w-4 h-4 flex items-center justify-center border rounded-sm ${selected ? "bg-blue-600 border-blue-600 text-white" : "border-gray-300"}`
151
+ },
152
+ selected && /* @__PURE__ */ React2.createElement(Check, { size: 14 })
153
+ ),
154
+ opt.label
155
+ );
156
+ }) : /* @__PURE__ */ React2.createElement("li", { className: "px-3 py-2 text-sm text-gray-400" }, "No results found")))
157
+ );
158
+ };
159
+
160
+ // src/inputs/Checkbox.jsx
161
+ import React3 from "react";
162
+ var CustomCheckbox = ({ onChange, checked }) => {
163
+ const handleChange = (e) => {
164
+ onChange(e.target.checked);
165
+ };
166
+ return /* @__PURE__ */ React3.createElement("label", { className: "inline-flex items-center cursor-pointer select-none" }, /* @__PURE__ */ React3.createElement(
167
+ "input",
168
+ {
169
+ type: "checkbox",
170
+ checked,
171
+ onChange: handleChange,
172
+ className: "peer hidden"
173
+ }
174
+ ), /* @__PURE__ */ React3.createElement(
175
+ "span",
176
+ {
177
+ className: "\r\n w-4 h-4 flex items-center justify-center border-2 border-gray-400 rounded \r\n peer-checked:bg-black peer-checked:border-black\r\n transition-colors\r\n "
178
+ },
179
+ checked && /* @__PURE__ */ React3.createElement(
180
+ "svg",
181
+ {
182
+ className: "w-4 h-4 text-white",
183
+ fill: "none",
184
+ stroke: "currentColor",
185
+ strokeWidth: "3",
186
+ viewBox: "0 0 24 24"
187
+ },
188
+ /* @__PURE__ */ React3.createElement("path", { d: "M5 13l4 4L19 7" })
189
+ )
190
+ ));
191
+ };
192
+
193
+ // src/inputs/Chip.jsx
194
+ import React4 from "react";
195
+ var VARIANTS = {
196
+ PRIMARY: "bg-gray-100 text-black",
197
+ GREEN: "bg-green-100 text-green-800",
198
+ RED: "bg-red-100 text-red-800",
199
+ YELLOW: "bg-yellow-100 text-yellow-800"
200
+ };
201
+ var Chip = ({ label, variant }) => {
202
+ return /* @__PURE__ */ React4.createElement(
203
+ "div",
204
+ {
205
+ className: `inline-flex text-[12px] items-center px-3 py-1 rounded-full ${VARIANTS[variant] || VARIANTS.PRIMARY} text-sm font-[600]`
206
+ },
207
+ label
208
+ );
209
+ };
210
+
211
+ // src/inputs/CustomSwitch.jsx
212
+ import React5 from "react";
213
+ var CustomSwitch = ({ checked, onChange, label, description }) => {
214
+ return /* @__PURE__ */ React5.createElement("div", null, /* @__PURE__ */ React5.createElement(
215
+ "button",
216
+ {
217
+ type: "button",
218
+ role: "switch",
219
+ "aria-checked": checked,
220
+ onClick: () => onChange(!checked),
221
+ className: `relative inline-flex h-6 w-11 shrink-0 items-center rounded-full transition-colors ${checked ? "bg-black" : "bg-gray-300"}`
222
+ },
223
+ /* @__PURE__ */ React5.createElement(
224
+ "span",
225
+ {
226
+ className: `inline-block h-4 w-4 transform rounded-full bg-white shadow transition ${checked ? "translate-x-6" : "translate-x-1"}`
227
+ }
228
+ )
229
+ ), /* @__PURE__ */ React5.createElement("div", { className: "flex flex-col" }, label && /* @__PURE__ */ React5.createElement("h3", { className: "font-[500] text-sm text-black mb-2" }, label), description && /* @__PURE__ */ React5.createElement("p", { className: "font-[500] text-sm text-[#737373]" }, description)));
230
+ };
231
+
232
+ // src/inputs/Input.jsx
233
+ import React6 from "react";
234
+ var CustomInput = ({
235
+ label,
236
+ isRequired,
237
+ value,
238
+ onChange,
239
+ placeholder,
240
+ disabled = false,
241
+ error,
242
+ heading
243
+ }) => {
244
+ return /* @__PURE__ */ React6.createElement("div", { className: "flex flex-col gap-1 w-full" }, heading && /* @__PURE__ */ React6.createElement("h3", { className: "text-lg font-semibold" }, heading), /* @__PURE__ */ React6.createElement(
245
+ "label",
246
+ {
247
+ className: `font-[500] text-sm ${heading ? "text-[#737373]" : "text-black"} dark:text-white`
248
+ },
249
+ label,
250
+ " ",
251
+ isRequired && /* @__PURE__ */ React6.createElement("span", { className: "text-red-500" }, "*")
252
+ ), /* @__PURE__ */ React6.createElement(
253
+ "input",
254
+ {
255
+ className: `border border-gray-200 rounded-md h-10 px-4 py-2 w-full text-[14px]
256
+ focus:outline-2 outline-black dark:outline-white outline-offset-2
257
+ dark:bg-transparent dark:text-white dark:border-[#303036]
258
+ ${disabled ? "bg-gray-100 cursor-not-allowed text-gray-500 border-gray-300" : error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)]"}
259
+ `,
260
+ value,
261
+ onChange: (e) => onChange == null ? void 0 : onChange(e.target.value),
262
+ placeholder,
263
+ disabled,
264
+ readOnly: disabled
265
+ }
266
+ ));
267
+ };
268
+
269
+ // src/inputs/ProgressBar.jsx
270
+ import React7 from "react";
271
+ var ProgressBar = ({ step, totalSteps }) => {
272
+ const progress = step / totalSteps * 100;
273
+ return /* @__PURE__ */ React7.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React7.createElement("p", { className: "text-gray-600 text-sm mb-2" }, "Step ", step, " of ", totalSteps), /* @__PURE__ */ React7.createElement("div", { className: "w-full bg-gray-200 rounded-full h-2" }, /* @__PURE__ */ React7.createElement(
274
+ "div",
275
+ {
276
+ className: "bg-black h-2 rounded-full transition-all duration-300",
277
+ style: { width: `${progress}%` }
278
+ }
279
+ )));
280
+ };
281
+
282
+ // src/inputs/Search.jsx
283
+ import React8 from "react";
284
+ import { Search as Search2 } from "lucide-react";
285
+ var CustomSearch = ({
286
+ value,
287
+ onChange,
288
+ placeholder = "Search Markets..."
289
+ }) => {
290
+ return /* @__PURE__ */ React8.createElement("div", { className: "flex items-center border bg-transparent text-[14px] border-[hsl(0_0%_89.8%)] \r\n rounded-md h-10 px-2 w-full focus-within:outline-2 focus-within:outline-black focus-within:outline-offset-2" }, /* @__PURE__ */ React8.createElement(Search2, { width: 16, height: 16, color: "gray", className: "mr-2" }), /* @__PURE__ */ React8.createElement(
291
+ "input",
292
+ {
293
+ type: "text",
294
+ value,
295
+ onChange,
296
+ placeholder,
297
+ className: "bg-transparent w-full h-full focus:outline-none"
298
+ }
299
+ ));
300
+ };
301
+
302
+ // src/inputs/TextArea.jsx
303
+ import React9 from "react";
304
+ var CustomTextarea = ({
305
+ label,
306
+ isRequired,
307
+ value,
308
+ onChange,
309
+ placeholder,
310
+ disabled = false,
311
+ error,
312
+ heading,
313
+ rows = 4
314
+ }) => {
315
+ return /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col gap-1 w-full" }, heading && /* @__PURE__ */ React9.createElement("h3", { className: "text-lg font-semibold" }, heading), /* @__PURE__ */ React9.createElement(
316
+ "label",
317
+ {
318
+ className: `font-[500] text-sm ${heading ? "text-[#737373]" : "text-black"}`
319
+ },
320
+ label,
321
+ " ",
322
+ isRequired && /* @__PURE__ */ React9.createElement("span", { className: "text-red-500" }, "*")
323
+ ), /* @__PURE__ */ React9.createElement(
324
+ "textarea",
325
+ {
326
+ rows,
327
+ className: `border rounded-md px-4 py-2 w-full text-[14px]
328
+ focus:outline-2 focus:outline-black focus:outline-offset-2
329
+ focus:ring-0 focus:shadow-none focus:border-black
330
+ ${disabled ? "bg-gray-100 text-gray-500 border-gray-300" : error ? "border-red-500 bg-red-50" : "bg-white border-[hsl(0_0%_89.8%)]"}
331
+ `,
332
+ value,
333
+ onChange: (e) => onChange == null ? void 0 : onChange(e.target.value),
334
+ placeholder,
335
+ disabled,
336
+ readOnly: disabled
337
+ }
338
+ ));
339
+ };
340
+
341
+ // src/inputs/Upload.jsx
342
+ import React10, { useRef as useRef2 } from "react";
343
+ import { Upload } from "lucide-react";
344
+ var CustomUpload = ({
345
+ label = "Supporting documents",
346
+ description = "Drop items here or Browse Files",
347
+ accept = ".pdf,.jpg,.jpeg,.png",
348
+ maxSizeMB = 5,
349
+ onChange,
350
+ error,
351
+ value
352
+ }) => {
353
+ const inputRef = useRef2(null);
354
+ const handleFileSelect = (files) => {
355
+ if (!files || files.length === 0) return;
356
+ const selectedFile = files[0];
357
+ if (selectedFile.size > maxSizeMB * 1024 * 1024) {
358
+ alert(`File size must be less than ${maxSizeMB} MB`);
359
+ return;
360
+ }
361
+ onChange == null ? void 0 : onChange(selectedFile);
362
+ };
363
+ return /* @__PURE__ */ React10.createElement("div", { className: "flex flex-col gap-2 w-full" }, label && /* @__PURE__ */ React10.createElement("label", { className: "text-sm font-medium" }, label), /* @__PURE__ */ React10.createElement(
364
+ "div",
365
+ {
366
+ className: `border-2 border-dashed rounded-lg p-6 flex flex-col items-center justify-center text-center cursor-pointer transition
367
+ ${error ? "border-red-500 bg-red-50" : "border-gray-300 hover:border-gray-400 bg-gray-50"}`,
368
+ onClick: () => {
369
+ var _a;
370
+ return (_a = inputRef.current) == null ? void 0 : _a.click();
371
+ },
372
+ onDragOver: (e) => e.preventDefault(),
373
+ onDrop: (e) => {
374
+ e.preventDefault();
375
+ handleFileSelect(e.dataTransfer.files);
376
+ }
377
+ },
378
+ /* @__PURE__ */ React10.createElement(Upload, { className: "w-6 h-6 text-gray-500 mb-2" }),
379
+ /* @__PURE__ */ React10.createElement("p", { className: "text-sm text-gray-700" }, description),
380
+ /* @__PURE__ */ React10.createElement("p", { className: "text-xs text-gray-500 mt-1" }, "File Supported: PDF/JPG/PNG, up to ", maxSizeMB, " MB"),
381
+ /* @__PURE__ */ React10.createElement(
382
+ "input",
383
+ {
384
+ ref: inputRef,
385
+ type: "file",
386
+ accept,
387
+ className: "hidden",
388
+ onChange: (e) => handleFileSelect(e.target.files)
389
+ }
390
+ )
391
+ ), value && /* @__PURE__ */ React10.createElement("span", { className: "text-sm truncate text-gray-500" }, "Selected: ", value.name), error && /* @__PURE__ */ React10.createElement("p", { className: "text-xs text-red-500" }, error));
392
+ };
393
+
394
+ // src/sideBar/SideBar.jsx
395
+ import { ChevronDown as ChevronDown2, Globe as Globe2, LogOut } from "lucide-react";
396
+ import React11, { useEffect, useState as useState2 } from "react";
397
+
398
+ // ConstantUI.js
399
+ import { Home, BaggageClaim, Users, Banknote, Globe, TrendingUp, FileText, FileKey2, LifeBuoy, Cog, Building, Handshake, DollarSign } from "lucide-react";
400
+ var navItemsConstant = [
401
+ {
402
+ Icon: Home,
403
+ label: "Home",
404
+ onClick: () => {
405
+ window.location.href = "/";
406
+ },
407
+ isDropDown: false
408
+ },
409
+ {
410
+ Icon: Handshake,
411
+ label: "Supplier Ecosystem",
412
+ onClick: () => {
413
+ },
414
+ isDropDown: true,
415
+ options: [
416
+ { label: "Suppliers", onClick: () => {
417
+ window.location.href = "/supplier/";
418
+ } }
419
+ ]
420
+ },
421
+ {
422
+ Icon: Building,
423
+ label: "Consumer Ecosystem",
424
+ onClick: () => {
425
+ },
426
+ options: [
427
+ {
428
+ label: "Corporate",
429
+ onClick: () => {
430
+ window.location.href = "/corporate/";
431
+ }
432
+ },
433
+ { label: "Trips", onClick: () => {
434
+ window.location.href = "/trips/";
435
+ } },
436
+ { label: "Reports", onClick: () => {
437
+ window.location.href = "/reports/";
438
+ } },
439
+ {
440
+ label: "Tags",
441
+ onClick: () => {
442
+ window.location.href = "/tags/";
443
+ }
444
+ }
445
+ ],
446
+ isDropDown: true
447
+ },
448
+ {
449
+ Icon: Banknote,
450
+ label: "Finance",
451
+ onClick: () => {
452
+ },
453
+ isDropDown: true,
454
+ options: [
455
+ { label: "Invoices", onClick: () => {
456
+ window.location.href = "/invoices/";
457
+ } },
458
+ { label: "Ledger", onClick: () => {
459
+ window.location.href = "/ledger/";
460
+ } },
461
+ { label: "Payments", onClick: () => {
462
+ window.location.href = "/payments/";
463
+ } }
464
+ ]
465
+ },
466
+ {
467
+ Icon: DollarSign,
468
+ label: "Revenue Management",
469
+ onClick: () => {
470
+ },
471
+ isDropDown: true,
472
+ options: [
473
+ {
474
+ label: "Pricing Policy",
475
+ onClick: () => {
476
+ window.location.href = "/pricing/";
477
+ }
478
+ },
479
+ { label: "Offers", onClick: () => {
480
+ window.location.href = "/offers/";
481
+ } },
482
+ { label: "Vouchers", onClick: () => {
483
+ window.location.href = "/vouchers/";
484
+ } },
485
+ { label: "Supplier Deals", onClick: () => {
486
+ window.location.href = "/supplierdeals/";
487
+ } },
488
+ {
489
+ label: "Subscription Plans",
490
+ onClick: () => {
491
+ window.location.href = "/subscription/";
492
+ }
493
+ }
494
+ ]
495
+ },
496
+ {
497
+ Icon: Cog,
498
+ label: "Settings",
499
+ onClick: () => {
500
+ },
501
+ isDropDown: true,
502
+ options: [
503
+ {
504
+ label: "Admin user Management",
505
+ isDropDown: true,
506
+ onClick: () => {
507
+ },
508
+ options: [
509
+ { label: "Admin Users", onClick: () => {
510
+ window.location.href = "/users/";
511
+ } },
512
+ { label: "Admin User Attributes", onClick: () => {
513
+ } }
514
+ ]
515
+ },
516
+ { label: "TMC Markets", onClick: () => {
517
+ window.location.href = "/market/";
518
+ } },
519
+ { label: "Permissions", onClick: () => {
520
+ window.location.href = "/permissions/";
521
+ } },
522
+ { label: "Report Configurations", onClick: () => {
523
+ window.location.href = "/reports/";
524
+ } },
525
+ { label: "Whitelabelling", onClick: () => {
526
+ window.location.href = "/whitelabelling/";
527
+ } }
528
+ ]
529
+ }
530
+ ];
531
+ var additionalItemsConstant = [
532
+ { Icon: LifeBuoy, label: "Help", onClick: () => {
533
+ window.location.href = "/help";
534
+ } }
535
+ ];
536
+
537
+ // src/assests/logo/sidebarlogo.webp
538
+ var sidebarlogo_default = "./sidebarlogo-S4TNJORM.webp";
539
+
540
+ // src/sideBar/SideBar.jsx
541
+ var AppSideBar = ({ username, role, navItems, additionalItems, sideBarLogo }) => {
542
+ var _a, _b;
543
+ const [authData, setAuthData] = useState2(null);
544
+ const handleIconRotate = (e, index, additionalKey) => {
545
+ let dropDownIcon = e.currentTarget.children[2];
546
+ if (!dropDownIcon) return;
547
+ if (dropDownIcon.classList.contains("rotate-180")) {
548
+ dropDownIcon.classList.remove("rotate-180");
549
+ } else {
550
+ dropDownIcon.classList.add("transition-all");
551
+ dropDownIcon.classList.add("rotate-180");
552
+ }
553
+ const optionsContainer = document.getElementById(`dropDownOptions-${index}${additionalKey ? `-${additionalKey}` : ""}`);
554
+ if (!optionsContainer) return;
555
+ optionsContainer.classList.add("transition-all");
556
+ if (optionsContainer.classList.contains("max-h-0")) {
557
+ optionsContainer.classList.remove("max-h-0");
558
+ optionsContainer.classList.add("min-h-[50px]");
559
+ } else {
560
+ optionsContainer.classList.remove("min-h-[50px]");
561
+ optionsContainer.classList.add("max-h-0");
562
+ }
563
+ };
564
+ const checkForAuthData = () => {
565
+ const params = new URLSearchParams(window.location.search);
566
+ let authData2 = params.get("authData");
567
+ if (authData2) {
568
+ authData2 = atob(authData2);
569
+ localStorage.setItem("authData", authData2);
570
+ setAuthData(JSON.parse(authData2));
571
+ params.delete("authData");
572
+ const newUrl = window.location.pathname + (params.toString() ? "?" + params.toString() : "");
573
+ window.history.replaceState({}, document.title, newUrl);
574
+ }
575
+ };
576
+ useEffect(() => {
577
+ checkForAuthData();
578
+ }, []);
579
+ useEffect(() => {
580
+ const storedAuthData = localStorage.getItem("authData");
581
+ if (storedAuthData) {
582
+ let parseData = JSON.parse(storedAuthData);
583
+ setAuthData(parseData);
584
+ }
585
+ }, [localStorage.getItem("authData")]);
586
+ const navItemsLocal = navItems ?? navItemsConstant;
587
+ const additionalItemsLocal = additionalItems ?? additionalItemsConstant;
588
+ const sideBarLogoLocal = sideBarLogo ?? sidebarlogo_default;
589
+ return /* @__PURE__ */ React11.createElement("div", { className: "w-[320px] transition-all ease-in-out delay-100 bg-transparent border-r border-gray-200 dark:border-[#303036] flex flex-col p-4 h-full max-h-[100vh]" }, /* @__PURE__ */ React11.createElement("div", { className: "p-2 mb-4" }, /* @__PURE__ */ React11.createElement("div", { className: "w-[108px] h-[40px] flex items-center \r\n justify-center" }, /* @__PURE__ */ React11.createElement("img", { src: sideBarLogoLocal, alt: "sidebarLogo", width: 108, height: 40 }))), /* @__PURE__ */ React11.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React11.createElement("div", { className: "flex ml-[20px] items-center gap-2 mb-2 dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React11.createElement(Globe2, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("h3", { className: "text-[#3f3f46cc] dark:text-[#f4f4f5cc] font-medium" }, "Data Centers")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement(CustomAutocomplete, { options: [] }))), /* @__PURE__ */ React11.createElement("div", { className: "overflow-y-auto" }, /* @__PURE__ */ React11.createElement("div", null, navItemsLocal == null ? void 0 : navItemsLocal.map((item, index) => {
590
+ return /* @__PURE__ */ React11.createElement("div", { key: index, className: "" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer rounded-lg ml-2", onClick: (e) => {
591
+ item.onClick && item.onClick(e);
592
+ handleIconRotate(e, index);
593
+ } }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, item.label), item.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))), item.options && item.options.length > 0 && /* @__PURE__ */ React11.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${index}` }, item.options.map((options, optionsIndex) => {
594
+ return /* @__PURE__ */ React11.createElement("div", { className: "" }, /* @__PURE__ */ React11.createElement(
595
+ "div",
596
+ {
597
+ className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] cursor-pointer",
598
+ onClick: (e) => {
599
+ options.onClick && options.onClick();
600
+ options.isDropDown && handleIconRotate(e, optionsIndex, "subOption");
601
+ }
602
+ },
603
+ /* @__PURE__ */ React11.createElement("div", null),
604
+ /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-sm text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, options.label),
605
+ options.isDropDown && /* @__PURE__ */ React11.createElement("div", { className: `ml-auto transition-all delay-75` }, /* @__PURE__ */ React11.createElement(ChevronDown2, { width: 20, height: 20 }))
606
+ ), options.options && options.options.length > 1 && /* @__PURE__ */ React11.createElement("div", { className: "ml-[20px] max-h-0 overflow-hidden flex flex-col", id: `dropDownOptions-${optionsIndex}-subOption` }, options.options.map((subOption) => {
607
+ return /* @__PURE__ */ React11.createElement(
608
+ "div",
609
+ {
610
+ className: "p-2 rounded-lg hover:bg-gray-100 text-[#3f3f46cc] dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] font-medium text-sm",
611
+ onClick: (e) => {
612
+ subOption.onClick && subOption.onClick();
613
+ }
614
+ },
615
+ subOption.label
616
+ );
617
+ })));
618
+ })));
619
+ })), /* @__PURE__ */ React11.createElement("div", { className: "border-t border-[#e5e5e5] dark:border-[#303036] mt-4" }, (additionalItemsLocal == null ? void 0 : additionalItemsLocal.length) > 0 && additionalItemsLocal.map((item, index) => {
620
+ return /* @__PURE__ */ React11.createElement("div", { key: index, className: "flex items-center gap-3 p-2 hover:bg-[#f3f4f6] dark:hover:bg-[#27272a] dark:text-[#f4f4f5cc] cursor-pointer", onClick: () => item.onClick && item.onClick() }, /* @__PURE__ */ React11.createElement(item.Icon, { width: 20, height: 20 }), /* @__PURE__ */ React11.createElement("span", { className: "font-medium text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, item.label));
621
+ }))), /* @__PURE__ */ React11.createElement("div", { className: "mt-auto bg-[#fafafa] dark:bg-transparent sticky bottom-0 pt-2" }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center justify-between p-2 rounded-lg hover:bg-[#f4f4f5] dark:hover:bg-[#27272a] cursor-pointer", onClick: () => {
622
+ window.location.href = "/profile";
623
+ } }, /* @__PURE__ */ React11.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React11.createElement("span", { className: "relative flex shrink-0 overflow-hidden rounded-full h-10 w-10" }, /* @__PURE__ */ React11.createElement("span", { className: "flex h-full w-full items-center justify-center rounded-full bg-muted" }, ((_a = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _a.UserName) ? authData.userInfo.UserName.split("")[0] : "A")), /* @__PURE__ */ React11.createElement("div", null, /* @__PURE__ */ React11.createElement("p", { className: "font-semibold" }, ((_b = authData == null ? void 0 : authData.userInfo) == null ? void 0 : _b.UserName) ? authData.userInfo.UserName : "Admin User"), /* @__PURE__ */ React11.createElement("p", { className: "text-sm text-[#3f3f46cc] dark:text-[#f4f4f5cc]" }, role))), /* @__PURE__ */ React11.createElement("div", { className: "text-[#18181b] dark:text-[#f4f4f5cc]" }, /* @__PURE__ */ React11.createElement(LogOut, null)))));
624
+ };
625
+
626
+ // src/RightSheet/RightSheet.jsx
627
+ import React12, { useEffect as useEffect2, useState as useState3 } from "react";
628
+ var RightSheet = ({
629
+ open,
630
+ setOpen,
631
+ children,
632
+ callBack,
633
+ actionLabel = "Save",
634
+ onAction = () => {
635
+ }
636
+ }) => {
637
+ const [visible, setVisible] = useState3(open);
638
+ useEffect2(() => {
639
+ if (open) {
640
+ document.body.style.overflow = "hidden";
641
+ setVisible(true);
642
+ }
643
+ return () => {
644
+ document.body.style.overflow = "auto";
645
+ };
646
+ }, [open]);
647
+ const handleClose = () => {
648
+ setVisible(false);
649
+ setTimeout(() => {
650
+ setOpen(false);
651
+ callBack();
652
+ }, 200);
653
+ };
654
+ const handleAction = () => {
655
+ onAction();
656
+ handleClose();
657
+ };
658
+ if (!visible) return null;
659
+ return /* @__PURE__ */ React12.createElement(
660
+ "div",
661
+ {
662
+ className: "fixed inset-0 overflow-x-hidden bg-black/80 sheetPopIn h-full overflow-auto ",
663
+ onClick: handleClose
664
+ },
665
+ /* @__PURE__ */ React12.createElement(
666
+ "div",
667
+ {
668
+ className: `absolute flex flex-col right-0 top-0 min-h-full min-w-[100%] md:min-w-[576px] bg-white
669
+ ${visible ? "sheetRightSlide" : "transition-all duration-200 translate-x-[100%]"} justify-between `,
670
+ onClick: (e) => e.stopPropagation()
671
+ },
672
+ /* @__PURE__ */ React12.createElement("div", { className: "bg-white min-h-full " }, children),
673
+ /* @__PURE__ */ React12.createElement("div", { className: "h-[90px] flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 p-6 border-t sticky bottom-0 bg-white border-[#e6e6e6]" }, /* @__PURE__ */ React12.createElement(CustomButton, { variant: "SECONDARY", onClick: () => handleClose() }, "Cancel"), /* @__PURE__ */ React12.createElement(CustomButton, { variant: "SECONDARY", onClick: handleAction }, actionLabel))
674
+ )
675
+ );
676
+ };
677
+
678
+ // src/Table/CustomTable.jsx
679
+ import React13 from "react";
680
+ var CustomTable = ({ tableHeader, setIsAllChecked, isAllChecked, children }) => {
681
+ return /* @__PURE__ */ React13.createElement("div", { className: "border border-[#e5e5e5] rounded-lg overflow-x-auto" }, /* @__PURE__ */ React13.createElement("div", { className: "w-full relative overflow-x-auto" }, /* @__PURE__ */ React13.createElement("table", { className: "w-full caption-bottom text-sm overflow-x-auto bg-white table-fixed border-collapse" }, /* @__PURE__ */ React13.createElement("thead", { className: "border-b border-[#e5e5e5]" }, /* @__PURE__ */ React13.createElement("tr", { className: "transition-colors text-[#737373] hover:bg-muted/50 \r\n data-[state=selected]:bg-muted" }, /* @__PURE__ */ React13.createElement("th", { className: "px-4 py-3 text-left w-[50px]" }, /* @__PURE__ */ React13.createElement(CustomCheckbox, { checked: isAllChecked, onChange: () => {
682
+ setIsAllChecked(!isAllChecked);
683
+ } })), tableHeader.map((header, index) => {
684
+ return /* @__PURE__ */ React13.createElement("th", { className: `px-4 py-3 text-sm font-medium ${index == tableHeader.length - 1 ? "text-right" : "text-left"}`, key: header + index }, header);
685
+ }))), /* @__PURE__ */ React13.createElement("tbody", null, children))));
686
+ };
687
+
688
+ // src/inputs/CustomSelect.jsx
689
+ import React14, { useState as useState4, useRef as useRef3 } from "react";
690
+ import { ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
691
+ var CustomSelect = ({
692
+ label,
693
+ value,
694
+ onChange,
695
+ options,
696
+ placeholder = "Select...",
697
+ isRequired = false,
698
+ error,
699
+ heading,
700
+ disabled = false
701
+ }) => {
702
+ const [open, setOpen] = useState4(false);
703
+ const [search, setSearch] = useState4("");
704
+ const wrapperRef = useRef3(null);
705
+ const handleBlur = (e) => {
706
+ var _a;
707
+ if (!((_a = wrapperRef.current) == null ? void 0 : _a.contains(e.relatedTarget))) {
708
+ setOpen(false);
709
+ }
710
+ };
711
+ const filteredOptions = options.filter(
712
+ (opt) => opt.label.toLowerCase().includes(search.toLowerCase())
713
+ );
714
+ const handleSelect = (val) => {
715
+ onChange(val);
716
+ setOpen(false);
717
+ };
718
+ const selectedOption = options.find((opt) => opt.value === value);
719
+ return /* @__PURE__ */ React14.createElement(
720
+ "div",
721
+ {
722
+ className: "flex flex-col w-full relative",
723
+ ref: wrapperRef,
724
+ tabIndex: disabled ? -1 : 0,
725
+ onBlur: handleBlur
726
+ },
727
+ heading && /* @__PURE__ */ React14.createElement("h3", { className: "text-lg font-semibold mb-1" }, heading),
728
+ label && /* @__PURE__ */ React14.createElement(
729
+ "label",
730
+ {
731
+ className: `font-medium text-sm mb-1 ${heading ? "text-gray-500" : "text-black"}`
732
+ },
733
+ label,
734
+ " ",
735
+ isRequired && /* @__PURE__ */ React14.createElement("span", { className: "text-red-500" }, "*")
736
+ ),
737
+ /* @__PURE__ */ React14.createElement(
738
+ "div",
739
+ {
740
+ onClick: () => !disabled && setOpen((prev) => !prev),
741
+ className: `flex justify-between items-center rounded-md px-3 py-2 text-sm border h-10 cursor-pointer
742
+ ${disabled ? "bg-gray-100 text-gray-400" : "bg-white hover:border-gray-400"}
743
+ ${error ? "border-red-500" : "border-gray-300"}
744
+ `
745
+ },
746
+ /* @__PURE__ */ React14.createElement("span", { className: `${selectedOption ? "text-black" : "text-gray-400"}` }, selectedOption ? selectedOption.label : placeholder),
747
+ /* @__PURE__ */ React14.createElement(
748
+ ChevronDown3,
749
+ {
750
+ className: `w-4 h-4 text-gray-500 transition-transform ${open ? "rotate-180" : ""}`
751
+ }
752
+ )
753
+ ),
754
+ open && !disabled && /* @__PURE__ */ React14.createElement("div", { className: "absolute top-full mt-1 w-full bg-white border border-gray-200 rounded-lg shadow-lg z-10 max-h-60 overflow-y-auto" }, /* @__PURE__ */ React14.createElement("div", { className: "flex items-center gap-2 p-2 border-b border-gray-200" }, /* @__PURE__ */ React14.createElement(Search3, { size: 16, className: "text-gray-400" }), /* @__PURE__ */ React14.createElement(
755
+ "input",
756
+ {
757
+ type: "text",
758
+ value: search,
759
+ onChange: (e) => setSearch(e.target.value),
760
+ placeholder: "Search...",
761
+ className: "flex-1 text-sm focus:outline-none"
762
+ }
763
+ )), /* @__PURE__ */ React14.createElement("ul", null, filteredOptions.length > 0 ? filteredOptions.map((opt) => /* @__PURE__ */ React14.createElement(
764
+ "li",
765
+ {
766
+ key: opt.value,
767
+ onClick: () => handleSelect(opt.value),
768
+ className: `px-3 py-2 text-sm cursor-pointer hover:bg-gray-100 ${value === opt.value ? "bg-gray-100 font-medium" : ""}`
769
+ },
770
+ opt.label
771
+ )) : /* @__PURE__ */ React14.createElement("li", { className: "px-3 py-2 text-sm text-gray-400" }, "No results found")))
772
+ );
773
+ };
774
+ export {
775
+ AppSideBar,
776
+ Chip,
777
+ CustomAutocomplete,
778
+ CustomButton,
779
+ CustomCheckbox,
780
+ CustomInput,
781
+ CustomSearch,
782
+ CustomSelect,
783
+ CustomSwitch,
784
+ CustomTable,
785
+ CustomTextarea,
786
+ CustomUpload,
787
+ ProgressBar,
788
+ RightSheet
789
+ };