@algorithm-shift/design-system 1.2.42 → 1.2.44

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.mjs CHANGED
@@ -1,3176 +1,50 @@
1
- // src/components/Layout/Modal.tsx
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- var Modal = ({
4
- children,
5
- onClose,
6
- label,
7
- className,
8
- style
9
- }) => {
10
- return /* @__PURE__ */ jsx("div", { className, style, children: /* @__PURE__ */ jsxs("div", { className: "min-h-80", children: [
11
- /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center p-4 border-b border-gray-300 bg-gray-100", children: [
12
- /* @__PURE__ */ jsx("h4", { className: "text-[#000]", children: label || "Modal Title" }),
13
- /* @__PURE__ */ jsx(
14
- "span",
15
- {
16
- className: "cursor-pointer text-[#000]",
17
- role: "presentation",
18
- onClick: onClose,
19
- children: "X"
20
- }
21
- )
22
- ] }),
23
- /* @__PURE__ */ jsx("div", { className: "h-90 overflow-y-auto p-4 custom-scroll", children })
24
- ] }) });
25
- };
26
- var Modal_default = Modal;
27
-
28
- // src/components/Layout/Flex.tsx
29
- import { jsx as jsx2 } from "react/jsx-runtime";
30
- var Flex = ({
31
- children,
32
- className,
33
- style,
34
- ...props
35
- }) => {
36
- return /* @__PURE__ */ jsx2("div", { ...props, className, style, children });
37
- };
38
- var Flex_default = Flex;
39
-
40
- // src/components/Layout/Grid.tsx
41
- import { jsx as jsx3 } from "react/jsx-runtime";
42
- var Grid = ({
43
- children,
44
- className,
45
- style,
46
- ...props
47
- }) => {
48
- return /* @__PURE__ */ jsx3("div", { ...props, className, style, children });
49
- };
50
- var Grid_default = Grid;
51
-
52
- // src/components/Layout/Container.tsx
53
- import { jsx as jsx4 } from "react/jsx-runtime";
54
- var Container = ({
55
- children,
56
- className,
57
- style,
58
- ...props
59
- }) => {
60
- return /* @__PURE__ */ jsx4("div", { ...props, className, style, children });
61
- };
62
- var Container_default = Container;
63
-
64
- // src/components/ui/button.tsx
65
- import { Slot } from "@radix-ui/react-slot";
66
- import { cva } from "class-variance-authority";
67
-
68
- // src/lib/utils.ts
69
- import { clsx } from "clsx";
70
- import { twMerge } from "tailwind-merge";
71
- function cn(...inputs) {
72
- return twMerge(clsx(inputs));
73
- }
74
- function getInitials(name) {
75
- const words = name.split(" ");
76
- if (words.length === 0) {
77
- return "";
78
- }
79
- if (words.length === 1) {
80
- return words[0].charAt(0);
81
- }
82
- return words[0].charAt(0) + words[1].charAt(0);
83
- }
84
-
85
- // src/components/ui/button.tsx
86
- import { jsx as jsx5 } from "react/jsx-runtime";
87
- var buttonVariants = cva(
88
- "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
89
- {
90
- variants: {
91
- variant: {
92
- default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
93
- destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
94
- outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
95
- secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
96
- ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
97
- link: "text-primary underline-offset-4 hover:underline"
98
- },
99
- size: {
100
- default: "h-9 px-4 py-2 has-[>svg]:px-3",
101
- sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
102
- lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
103
- icon: "size-9"
104
- }
105
- },
106
- defaultVariants: {
107
- variant: "default",
108
- size: "default"
109
- }
110
- }
111
- );
112
- function Button({
113
- className,
114
- variant,
115
- size,
116
- asChild = false,
117
- ...props
118
- }) {
119
- const Comp = asChild ? Slot : "button";
120
- return /* @__PURE__ */ jsx5(
121
- Comp,
122
- {
123
- "data-slot": "button",
124
- className: cn(buttonVariants({ variant, size, className })),
125
- ...props
126
- }
127
- );
128
- }
129
-
130
- // src/components/Basic/Button/Button.tsx
131
- import { jsx as jsx6 } from "react/jsx-runtime";
132
- var ButtonWrapper = ({
133
- className,
134
- style,
135
- textContent = "Button",
136
- ...props
137
- }) => {
138
- return /* @__PURE__ */ jsx6(
139
- Button,
140
- {
141
- ...props,
142
- className,
143
- style,
144
- children: textContent
145
- }
146
- );
147
- };
148
- var Button_default = ButtonWrapper;
149
-
150
- // src/assets/image-placeholder.png
151
- var image_placeholder_default = "data:image/png;base64,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";
152
-
153
- // src/components/Basic/Image/Image.tsx
154
- import { jsx as jsx7 } from "react/jsx-runtime";
155
- var ImageControl = ({
156
- className,
157
- style,
158
- imageUrl,
159
- imageUrlExternal,
160
- altText = "Preview"
161
- }) => {
162
- const imageClass = cn(
163
- "h-[200px] w-[200px] border-1",
164
- "border-2 border-dashed border-gray-400 flex items-center justify-center cursor-pointer hover:border-blue-500 transition"
165
- );
166
- const defaultImgClass = cn(
167
- "w-full h-full",
168
- className
169
- );
170
- if (!imageUrl && !imageUrlExternal) {
171
- return /* @__PURE__ */ jsx7("div", { className: imageClass, children: /* @__PURE__ */ jsx7("img", { src: image_placeholder_default, alt: altText, className: "opacity-50", width: 50, height: 50 }) });
172
- }
173
- const url = imageUrlExternal || imageUrl;
174
- return /* @__PURE__ */ jsx7("img", { src: url, alt: altText, className: defaultImgClass, style });
175
- };
176
- var Image_default = ImageControl;
177
-
178
- // src/components/Basic/Shape/Shape.tsx
179
- import { jsx as jsx8 } from "react/jsx-runtime";
180
- var Shape = ({
181
- children,
182
- className,
183
- style
184
- }) => {
185
- return /* @__PURE__ */ jsx8("div", { className, style, children });
186
- };
187
- var Shape_default = Shape;
188
-
189
- // src/components/Basic/Typography/Typography.tsx
190
- import React from "react";
191
- var Typography = ({
192
- className,
193
- style,
194
- tagName,
195
- textContent
196
- }) => {
197
- const Tag = tagName || "h1";
198
- return React.createElement(
199
- Tag,
200
- {
201
- style,
202
- className: cn(className, "pointer-events-auto")
203
- },
204
- [
205
- React.createElement("span", {
206
- key: "html",
207
- className: "pointer-events-none",
208
- dangerouslySetInnerHTML: { __html: textContent }
209
- })
210
- ]
211
- );
212
- };
213
- var Typography_default = Typography;
214
-
215
- // node_modules/lucide-react/dist/esm/createLucideIcon.js
216
- import { forwardRef as forwardRef2, createElement as createElement2 } from "react";
217
-
218
- // node_modules/lucide-react/dist/esm/shared/src/utils.js
219
- var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
220
- var toCamelCase = (string) => string.replace(
221
- /^([A-Z])|[\s-_]+(\w)/g,
222
- (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase()
223
- );
224
- var toPascalCase = (string) => {
225
- const camelCase = toCamelCase(string);
226
- return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
227
- };
228
- var mergeClasses = (...classes) => classes.filter((className, index, array) => {
229
- return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
230
- }).join(" ").trim();
231
- var hasA11yProp = (props) => {
232
- for (const prop in props) {
233
- if (prop.startsWith("aria-") || prop === "role" || prop === "title") {
234
- return true;
235
- }
236
- }
237
- };
238
-
239
- // node_modules/lucide-react/dist/esm/Icon.js
240
- import { forwardRef, createElement } from "react";
241
-
242
- // node_modules/lucide-react/dist/esm/defaultAttributes.js
243
- var defaultAttributes = {
244
- xmlns: "http://www.w3.org/2000/svg",
245
- width: 24,
246
- height: 24,
247
- viewBox: "0 0 24 24",
248
- fill: "none",
249
- stroke: "currentColor",
250
- strokeWidth: 2,
251
- strokeLinecap: "round",
252
- strokeLinejoin: "round"
253
- };
254
-
255
- // node_modules/lucide-react/dist/esm/Icon.js
256
- var Icon = forwardRef(
257
- ({
258
- color = "currentColor",
259
- size = 24,
260
- strokeWidth = 2,
261
- absoluteStrokeWidth,
262
- className = "",
263
- children,
264
- iconNode,
265
- ...rest
266
- }, ref) => createElement(
267
- "svg",
268
- {
269
- ref,
270
- ...defaultAttributes,
271
- width: size,
272
- height: size,
273
- stroke: color,
274
- strokeWidth: absoluteStrokeWidth ? Number(strokeWidth) * 24 / Number(size) : strokeWidth,
275
- className: mergeClasses("lucide", className),
276
- ...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
277
- ...rest
278
- },
279
- [
280
- ...iconNode.map(([tag, attrs]) => createElement(tag, attrs)),
281
- ...Array.isArray(children) ? children : [children]
282
- ]
283
- )
284
- );
285
-
286
- // node_modules/lucide-react/dist/esm/createLucideIcon.js
287
- var createLucideIcon = (iconName, iconNode) => {
288
- const Component = forwardRef2(
289
- ({ className, ...props }, ref) => createElement2(Icon, {
290
- ref,
291
- iconNode,
292
- className: mergeClasses(
293
- `lucide-${toKebabCase(toPascalCase(iconName))}`,
294
- `lucide-${iconName}`,
295
- className
296
- ),
297
- ...props
298
- })
299
- );
300
- Component.displayName = toPascalCase(iconName);
301
- return Component;
302
- };
303
-
304
- // node_modules/lucide-react/dist/esm/icons/bell.js
305
- var __iconNode = [
306
- ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
307
- [
308
- "path",
309
- {
310
- d: "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326",
311
- key: "11g9vi"
312
- }
313
- ]
314
- ];
315
- var Bell = createLucideIcon("bell", __iconNode);
316
-
317
- // node_modules/lucide-react/dist/esm/icons/calculator.js
318
- var __iconNode2 = [
319
- ["rect", { width: "16", height: "20", x: "4", y: "2", rx: "2", key: "1nb95v" }],
320
- ["line", { x1: "8", x2: "16", y1: "6", y2: "6", key: "x4nwl0" }],
321
- ["line", { x1: "16", x2: "16", y1: "14", y2: "18", key: "wjye3r" }],
322
- ["path", { d: "M16 10h.01", key: "1m94wz" }],
323
- ["path", { d: "M12 10h.01", key: "1nrarc" }],
324
- ["path", { d: "M8 10h.01", key: "19clt8" }],
325
- ["path", { d: "M12 14h.01", key: "1etili" }],
326
- ["path", { d: "M8 14h.01", key: "6423bh" }],
327
- ["path", { d: "M12 18h.01", key: "mhygvu" }],
328
- ["path", { d: "M8 18h.01", key: "lrp35t" }]
329
- ];
330
- var Calculator = createLucideIcon("calculator", __iconNode2);
331
-
332
- // node_modules/lucide-react/dist/esm/icons/calendar.js
333
- var __iconNode3 = [
334
- ["path", { d: "M8 2v4", key: "1cmpym" }],
335
- ["path", { d: "M16 2v4", key: "4m81vk" }],
336
- ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
337
- ["path", { d: "M3 10h18", key: "8toen8" }]
338
- ];
339
- var Calendar = createLucideIcon("calendar", __iconNode3);
340
-
341
- // node_modules/lucide-react/dist/esm/icons/check.js
342
- var __iconNode4 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
343
- var Check = createLucideIcon("check", __iconNode4);
344
-
345
- // node_modules/lucide-react/dist/esm/icons/chevron-down.js
346
- var __iconNode5 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
347
- var ChevronDown = createLucideIcon("chevron-down", __iconNode5);
348
-
349
- // node_modules/lucide-react/dist/esm/icons/chevron-left.js
350
- var __iconNode6 = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]];
351
- var ChevronLeft = createLucideIcon("chevron-left", __iconNode6);
352
-
353
- // node_modules/lucide-react/dist/esm/icons/chevron-right.js
354
- var __iconNode7 = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
355
- var ChevronRight = createLucideIcon("chevron-right", __iconNode7);
356
-
357
- // node_modules/lucide-react/dist/esm/icons/chevron-up.js
358
- var __iconNode8 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
359
- var ChevronUp = createLucideIcon("chevron-up", __iconNode8);
360
-
361
- // node_modules/lucide-react/dist/esm/icons/circle.js
362
- var __iconNode9 = [["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]];
363
- var Circle = createLucideIcon("circle", __iconNode9);
364
-
365
- // node_modules/lucide-react/dist/esm/icons/ellipsis.js
366
- var __iconNode10 = [
367
- ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
368
- ["circle", { cx: "19", cy: "12", r: "1", key: "1wjl8i" }],
369
- ["circle", { cx: "5", cy: "12", r: "1", key: "1pcz8c" }]
370
- ];
371
- var Ellipsis = createLucideIcon("ellipsis", __iconNode10);
372
-
373
- // node_modules/lucide-react/dist/esm/icons/mail.js
374
- var __iconNode11 = [
375
- ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
376
- ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
377
- ];
378
- var Mail = createLucideIcon("mail", __iconNode11);
379
-
380
- // node_modules/lucide-react/dist/esm/icons/menu.js
381
- var __iconNode12 = [
382
- ["path", { d: "M4 12h16", key: "1lakjw" }],
383
- ["path", { d: "M4 18h16", key: "19g7jn" }],
384
- ["path", { d: "M4 6h16", key: "1o0s65" }]
385
- ];
386
- var Menu = createLucideIcon("menu", __iconNode12);
387
-
388
- // node_modules/lucide-react/dist/esm/icons/scan-eye.js
389
- var __iconNode13 = [
390
- ["path", { d: "M3 7V5a2 2 0 0 1 2-2h2", key: "aa7l1z" }],
391
- ["path", { d: "M17 3h2a2 2 0 0 1 2 2v2", key: "4qcy5o" }],
392
- ["path", { d: "M21 17v2a2 2 0 0 1-2 2h-2", key: "6vwrx8" }],
393
- ["path", { d: "M7 21H5a2 2 0 0 1-2-2v-2", key: "ioqczr" }],
394
- ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
395
- [
396
- "path",
397
- {
398
- d: "M18.944 12.33a1 1 0 0 0 0-.66 7.5 7.5 0 0 0-13.888 0 1 1 0 0 0 0 .66 7.5 7.5 0 0 0 13.888 0",
399
- key: "11ak4c"
400
- }
401
- ]
402
- ];
403
- var ScanEye = createLucideIcon("scan-eye", __iconNode13);
404
-
405
- // node_modules/lucide-react/dist/esm/icons/search.js
406
- var __iconNode14 = [
407
- ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
408
- ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
409
- ];
410
- var Search = createLucideIcon("search", __iconNode14);
411
-
412
- // src/components/Basic/Breadcrumb/Breadcrumb.tsx
413
- import { jsx as jsx9, jsxs as jsxs2 } from "react/jsx-runtime";
414
- var Breadcrumb = ({ list = [], className, style, LinkComponent }) => {
415
- return /* @__PURE__ */ jsx9(
416
- "nav",
417
- {
418
- "aria-label": "breadcrumb",
419
- className: cn("flex items-center text-sm text-muted-foreground", className),
420
- style,
421
- children: list.map((item, index) => {
422
- const isLast = index === list.length - 1;
423
- return /* @__PURE__ */ jsxs2("div", { className: "flex items-center", children: [
424
- item.url && !isLast && LinkComponent ? /* @__PURE__ */ jsx9(
425
- LinkComponent,
426
- {
427
- href: item.url,
428
- className: "hover:text-foreground transition-colors",
429
- children: item.header
430
- }
431
- ) : /* @__PURE__ */ jsx9("span", { className: "text-foreground font-medium", children: item.header }),
432
- !isLast && /* @__PURE__ */ jsx9(ChevronRight, { className: "mx-2 h-4 w-4 text-muted-foreground" })
433
- ] }, item.id);
434
- })
435
- }
436
- );
437
- };
438
- var Breadcrumb_default = Breadcrumb;
439
-
440
- // src/components/ui/dropdown-menu.tsx
441
- import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
442
- import { jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
443
- function DropdownMenu({
444
- ...props
445
- }) {
446
- return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
447
- }
448
- function DropdownMenuTrigger({
449
- ...props
450
- }) {
451
- return /* @__PURE__ */ jsx10(
452
- DropdownMenuPrimitive.Trigger,
453
- {
454
- "data-slot": "dropdown-menu-trigger",
455
- ...props
456
- }
457
- );
458
- }
459
- function DropdownMenuContent({
460
- className,
461
- sideOffset = 4,
462
- ...props
463
- }) {
464
- return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx10(
465
- DropdownMenuPrimitive.Content,
466
- {
467
- "data-slot": "dropdown-menu-content",
468
- sideOffset,
469
- className: cn(
470
- "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
471
- className
472
- ),
473
- ...props
474
- }
475
- ) });
476
- }
477
- function DropdownMenuItem({
478
- className,
479
- inset,
480
- variant = "default",
481
- ...props
482
- }) {
483
- return /* @__PURE__ */ jsx10(
484
- DropdownMenuPrimitive.Item,
485
- {
486
- "data-slot": "dropdown-menu-item",
487
- "data-inset": inset,
488
- "data-variant": variant,
489
- className: cn(
490
- "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
491
- className
492
- ),
493
- ...props
494
- }
495
- );
496
- }
497
- function DropdownMenuLabel({
498
- className,
499
- inset,
500
- ...props
501
- }) {
502
- return /* @__PURE__ */ jsx10(
503
- DropdownMenuPrimitive.Label,
504
- {
505
- "data-slot": "dropdown-menu-label",
506
- "data-inset": inset,
507
- className: cn(
508
- "px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
509
- className
510
- ),
511
- ...props
512
- }
513
- );
514
- }
515
- function DropdownMenuSeparator({
516
- className,
517
- ...props
518
- }) {
519
- return /* @__PURE__ */ jsx10(
520
- DropdownMenuPrimitive.Separator,
521
- {
522
- "data-slot": "dropdown-menu-separator",
523
- className: cn("bg-border -mx-1 my-1 h-px", className),
524
- ...props
525
- }
526
- );
527
- }
528
- function DropdownMenuSub({
529
- ...props
530
- }) {
531
- return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
532
- }
533
- function DropdownMenuSubTrigger({
534
- className,
535
- inset,
536
- children,
537
- ...props
538
- }) {
539
- return /* @__PURE__ */ jsxs3(
540
- DropdownMenuPrimitive.SubTrigger,
541
- {
542
- "data-slot": "dropdown-menu-sub-trigger",
543
- "data-inset": inset,
544
- className: cn(
545
- "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
546
- className
547
- ),
548
- ...props,
549
- children: [
550
- children,
551
- /* @__PURE__ */ jsx10(ChevronRight, { className: "ml-auto size-4" })
552
- ]
553
- }
554
- );
555
- }
556
- function DropdownMenuSubContent({
557
- className,
558
- ...props
559
- }) {
560
- return /* @__PURE__ */ jsx10(
561
- DropdownMenuPrimitive.SubContent,
562
- {
563
- "data-slot": "dropdown-menu-sub-content",
564
- className: cn(
565
- "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
566
- className
567
- ),
568
- ...props
569
- }
570
- );
571
- }
572
-
573
- // src/components/Basic/ButtonGroup/ButtonGroup.tsx
574
- import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
575
- function SplitButton({ style, textContent, className, list = [], LinkComponent }) {
576
- const bgColor = style?.backgroundColor || "";
577
- return /* @__PURE__ */ jsxs4("div", { className: "inline-flex rounded-md overflow-hidden border border-teal-200 bg-teal-700 items-center focus:ring-0", style: { backgroundColor: bgColor }, children: [
578
- /* @__PURE__ */ jsx11(
579
- Button,
580
- {
581
- className: `rounded-none border-r px-4 py-2 text-whit focus:ring-0 ${className || ""}`,
582
- style: { backgroundColor: bgColor },
583
- children: textContent || "Button"
584
- }
585
- ),
586
- /* @__PURE__ */ jsxs4(DropdownMenu, { children: [
587
- /* @__PURE__ */ jsx11(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx11(
588
- Button,
589
- {
590
- className: "rounded-none bg-teal-700 px-4 py-2 text-white ring-0 shadow-none hover:bg-teal-600 focus:ring-0",
591
- "aria-label": "Open Dropdown",
592
- style: { backgroundColor: bgColor },
593
- children: /* @__PURE__ */ jsx11(ChevronDown, { className: "w-4 h-4" })
594
- }
595
- ) }),
596
- /* @__PURE__ */ jsx11(DropdownMenuContent, { align: "end", className: "bg-white min-w-[120px]", children: list.map((item) => /* @__PURE__ */ jsx11(DropdownMenuItem, { className: "text-black", children: LinkComponent ? /* @__PURE__ */ jsx11(LinkComponent, { href: item.url || "#", children: item.header }) : item.header }, item.id)) })
597
- ] })
598
- ] });
599
- }
600
-
601
- // src/components/Inputs/TextInput/TextInput.tsx
602
- import * as React2 from "react";
603
-
604
- // src/components/ui/input.tsx
605
- import { jsx as jsx12 } from "react/jsx-runtime";
606
- function Input({ className, type, ...props }) {
607
- return /* @__PURE__ */ jsx12(
608
- "input",
609
- {
610
- type,
611
- "data-slot": "input",
612
- className: cn(
613
- "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
614
- "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
615
- "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
616
- className
617
- ),
618
- ...props
619
- }
620
- );
621
- }
622
-
623
- // src/components/Inputs/TextInput/TextInput.tsx
624
- import { Fragment, jsx as jsx13, jsxs as jsxs5 } from "react/jsx-runtime";
625
- var TextInput = ({ className, style, ...props }) => {
626
- const placeholder = props.placeholder || "Placeholder text";
627
- const isEditable = props.isEditable ?? true;
628
- const isDisabled = props.isDisabled ?? false;
629
- const isReadonly = props.isReadonly ?? false;
630
- const isAutocomplete = props.isAutocomplete ?? false;
631
- const [error, setError] = React2.useState(null);
632
- React2.useEffect(() => {
633
- if (!props.validateOnMount) return;
634
- setError(props.errorMessage || null);
635
- }, [props.errorMessage, props.validateOnMount]);
636
- const handleChange = (e) => {
637
- props.onChange?.(e);
638
- };
639
- return /* @__PURE__ */ jsxs5(Fragment, { children: [
640
- /* @__PURE__ */ jsx13(
641
- Input,
642
- {
643
- type: "text",
644
- name: props.name,
645
- className: cn(className, error ? "border-red-500" : ""),
646
- style: {
647
- ...style,
648
- borderColor: error ? "#f87171" : style?.borderColor
649
- },
650
- value: props.value,
651
- autoComplete: isAutocomplete ? "on" : "off",
652
- placeholder,
653
- onChange: handleChange,
654
- disabled: isDisabled || !isEditable,
655
- readOnly: isReadonly
656
- }
657
- ),
658
- error && /* @__PURE__ */ jsx13("p", { className: "mt-1 text-xs text-red-500", children: error })
659
- ] });
660
- };
661
- var TextInput_default = TextInput;
662
-
663
- // src/components/Inputs/NumberInput/NumberInput.tsx
664
- import * as React3 from "react";
665
- import { useEffect as useEffect2 } from "react";
666
- import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
667
- var NumberInput = ({ className, style, ...props }) => {
668
- const placeholder = props.placeholder ?? "Placeholder text";
669
- const isEditable = props.isEditable ?? true;
670
- const isDisabled = props.isDisabled ?? false;
671
- const isReadonly = props.isReadonly ?? false;
672
- const isAutocomplete = props.isAutocomplete ?? false;
673
- const [error, setError] = React3.useState(null);
674
- useEffect2(() => {
675
- if (!props.validateOnMount) return;
676
- setError(props.errorMessage || null);
677
- }, [props.errorMessage, props.validateOnMount]);
678
- const handleChange = (e) => {
679
- props.onChange?.(e);
680
- };
681
- return /* @__PURE__ */ jsxs6(Fragment2, { children: [
682
- /* @__PURE__ */ jsxs6("div", { className: "flex justify-start items-center relative", children: [
683
- /* @__PURE__ */ jsx14(Calculator, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
684
- /* @__PURE__ */ jsx14(
685
- Input,
686
- {
687
- type: "number",
688
- id: props.name || "number-field",
689
- name: props.name,
690
- value: props.value,
691
- className: cn(className, error ? "border-red-500" : ""),
692
- style: {
693
- ...style,
694
- borderColor: error ? "#f87171" : style?.borderColor
695
- },
696
- autoComplete: isAutocomplete ? "on" : "off",
697
- placeholder,
698
- onChange: handleChange,
699
- disabled: isDisabled || !isEditable,
700
- readOnly: isReadonly
701
- }
702
- )
703
- ] }),
704
- error && /* @__PURE__ */ jsx14("p", { className: "mt-1 text-xs text-red-500", children: error })
705
- ] });
706
- };
707
- var NumberInput_default = NumberInput;
708
-
709
- // src/components/Inputs/EmailInput/EmailInput.tsx
710
- import * as React4 from "react";
711
- import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
712
- var EmailInput = ({ className, style, ...props }) => {
713
- const placeholder = props.placeholder ?? "Placeholder text";
714
- const isEditable = props.isEditable ?? true;
715
- const isDisabled = props.isDisabled ?? false;
716
- const isReadonly = props.isReadonly ?? false;
717
- const isAutocomplete = props.isAutocomplete ?? false;
718
- const [error, setError] = React4.useState(null);
719
- React4.useEffect(() => {
720
- if (!props.validateOnMount) return;
721
- setError(props.errorMessage || null);
722
- }, [props.errorMessage, props.validateOnMount]);
723
- const handleChange = (e) => {
724
- props.onChange?.(e);
725
- };
726
- return /* @__PURE__ */ jsxs7(Fragment3, { children: [
727
- /* @__PURE__ */ jsxs7("div", { className: "flex justify-start items-center relative", children: [
728
- /* @__PURE__ */ jsx15(Mail, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
729
- /* @__PURE__ */ jsx15(
730
- Input,
731
- {
732
- type: "email",
733
- name: props.name,
734
- value: props.value,
735
- className: cn(className, error ? "border-red-500" : ""),
736
- style: {
737
- ...style,
738
- borderColor: error ? "#f87171" : style?.borderColor
739
- },
740
- autoComplete: isAutocomplete ? "on" : "off",
741
- placeholder,
742
- onChange: handleChange,
743
- disabled: isDisabled || !isEditable,
744
- readOnly: isReadonly
745
- }
746
- )
747
- ] }),
748
- error && /* @__PURE__ */ jsx15("p", { className: "mt-1 text-xs text-red-500", children: error })
749
- ] });
750
- };
751
- var EmailInput_default = EmailInput;
752
-
753
- // src/components/Inputs/PasswordInput/PasswordInput.tsx
754
- import * as React5 from "react";
755
- import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
756
- var PasswordInput = ({ className, style, ...props }) => {
757
- const placeholder = props.placeholder ?? "Placeholder text";
758
- const isEditable = props.isEditable ?? true;
759
- const isDisabled = props.isDisabled ?? false;
760
- const isReadonly = props.isReadonly ?? false;
761
- const isAutocomplete = props.isAutocomplete ?? false;
762
- const [error, setError] = React5.useState(null);
763
- React5.useEffect(() => {
764
- if (!props.validateOnMount) return;
765
- setError(props.errorMessage || null);
766
- }, [props.errorMessage, props.validateOnMount]);
767
- const handleChange = (e) => {
768
- props.onChange?.(e);
769
- };
770
- return /* @__PURE__ */ jsxs8(Fragment4, { children: [
771
- /* @__PURE__ */ jsxs8("div", { className: "flex justify-start items-center relative", children: [
772
- /* @__PURE__ */ jsx16(ScanEye, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
773
- /* @__PURE__ */ jsx16(
774
- Input,
775
- {
776
- type: "password",
777
- id: props.name || "password-field",
778
- name: props.name,
779
- value: props.value,
780
- className: cn(className, error ? "border-red-500" : ""),
781
- style: {
782
- ...style,
783
- borderColor: error ? "#f87171" : style?.borderColor
784
- },
785
- autoComplete: isAutocomplete ? "on" : "off",
786
- placeholder,
787
- onChange: handleChange,
788
- disabled: isDisabled || !isEditable,
789
- readOnly: isReadonly
790
- }
791
- )
792
- ] }),
793
- error && /* @__PURE__ */ jsx16("p", { className: "mt-1 text-xs text-red-500", children: error })
794
- ] });
795
- };
796
- var PasswordInput_default = PasswordInput;
797
-
798
- // src/components/Inputs/Textarea/Textarea.tsx
799
- import * as React6 from "react";
800
-
801
- // src/components/ui/textarea.tsx
802
- import { jsx as jsx17 } from "react/jsx-runtime";
803
- function Textarea({ className, ...props }) {
804
- return /* @__PURE__ */ jsx17(
805
- "textarea",
806
- {
807
- "data-slot": "textarea",
808
- className: cn(
809
- "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
810
- className
811
- ),
812
- ...props
813
- }
814
- );
815
- }
816
-
817
- // src/components/Inputs/Textarea/Textarea.tsx
818
- import { Fragment as Fragment5, jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
819
- var Textarea2 = ({ className, style, ...props }) => {
820
- const placeholder = props.placeholder ?? "Placeholder text";
821
- const isEditable = props.isEditable ?? true;
822
- const isDisabled = props.isDisabled ?? false;
823
- const isReadonly = props.isReadonly ?? false;
824
- const isAutocomplete = props.isAutocomplete ?? false;
825
- const [error, setError] = React6.useState(null);
826
- React6.useEffect(() => {
827
- if (!props.validateOnMount) return;
828
- setError(props.errorMessage || null);
829
- }, [props.errorMessage, props.validateOnMount]);
830
- const handleChange = (e) => {
831
- props.onChange?.(e);
832
- };
833
- return /* @__PURE__ */ jsxs9(Fragment5, { children: [
834
- /* @__PURE__ */ jsx18(
835
- Textarea,
836
- {
837
- id: "textarea-field",
838
- name: props.name,
839
- value: props.value,
840
- className: cn(className, error ? "border-red-500" : ""),
841
- style: {
842
- ...style,
843
- borderColor: error ? "#f87171" : style?.borderColor
844
- },
845
- autoComplete: isAutocomplete ? "on" : "off",
846
- placeholder,
847
- onChange: handleChange,
848
- disabled: isDisabled || !isEditable,
849
- readOnly: isReadonly
850
- }
851
- ),
852
- error && /* @__PURE__ */ jsx18("p", { className: "mt-1 text-xs text-red-500", children: error })
853
- ] });
854
- };
855
- var Textarea_default = Textarea2;
856
-
857
- // src/components/Inputs/UrlInput/UrlInput.tsx
858
- import * as React7 from "react";
859
- import { Fragment as Fragment6, jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
860
- var UrlInput = ({ className, style, ...props }) => {
861
- const placeholder = props.placeholder ?? "Placeholder text";
862
- const isEditable = props.isEditable ?? true;
863
- const isDisabled = props.isDisabled ?? false;
864
- const isReadonly = props.isReadonly ?? false;
865
- const isAutocomplete = props.isAutocomplete ?? false;
866
- const [error, setError] = React7.useState(null);
867
- React7.useEffect(() => {
868
- if (!props.validateOnMount) return;
869
- setError(props.errorMessage || null);
870
- }, [props.errorMessage, props.validateOnMount]);
871
- const handleChange = (e) => {
872
- props.onChange?.(e);
873
- };
874
- return /* @__PURE__ */ jsxs10(Fragment6, { children: [
875
- /* @__PURE__ */ jsxs10("div", { className: "flex justify-start items-center relative", children: [
876
- /* @__PURE__ */ jsx19("div", { className: "bg-[#E9E9E9] absolute px-10 text-center top-1/2 h-full justify-center items-center flex w-10 -translate-y-1/2 text-[#383838] font-[500] text-[12px]", children: "https://" }),
877
- /* @__PURE__ */ jsx19(
878
- Input,
879
- {
880
- id: "url-field",
881
- type: "url",
882
- name: props.name,
883
- value: props.value,
884
- className: cn(className, error ? "border-red-500" : ""),
885
- style: {
886
- ...style,
887
- borderColor: error ? "#f87171" : style?.borderColor
888
- },
889
- autoComplete: isAutocomplete ? "on" : "off",
890
- placeholder,
891
- onChange: handleChange,
892
- disabled: isDisabled || !isEditable,
893
- readOnly: isReadonly
894
- }
895
- )
896
- ] }),
897
- error && /* @__PURE__ */ jsx19("p", { className: "mt-1 text-xs text-red-500", children: error })
898
- ] });
899
- };
900
- var UrlInput_default = UrlInput;
901
-
902
- // src/components/Inputs/Checkbox/Checkbox.tsx
903
- import { useEffect as useEffect7, useState as useState7 } from "react";
904
-
905
- // src/components/ui/checkbox.tsx
906
- import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
907
- import { jsx as jsx20 } from "react/jsx-runtime";
908
- function Checkbox({
909
- className,
910
- ...props
911
- }) {
912
- return /* @__PURE__ */ jsx20(
913
- CheckboxPrimitive.Root,
914
- {
915
- "data-slot": "checkbox",
916
- className: cn(
917
- "peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
918
- className
919
- ),
920
- ...props,
921
- children: /* @__PURE__ */ jsx20(
922
- CheckboxPrimitive.Indicator,
923
- {
924
- "data-slot": "checkbox-indicator",
925
- className: "flex items-center justify-center text-current transition-none",
926
- children: /* @__PURE__ */ jsx20(Check, { className: "size-3.5" })
927
- }
928
- )
929
- }
930
- );
931
- }
932
-
933
- // src/components/ui/label.tsx
934
- import * as LabelPrimitive from "@radix-ui/react-label";
935
- import { jsx as jsx21 } from "react/jsx-runtime";
936
- function Label2({
937
- className,
938
- ...props
939
- }) {
940
- return /* @__PURE__ */ jsx21(
941
- LabelPrimitive.Root,
942
- {
943
- "data-slot": "label",
944
- className: cn(
945
- "flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
946
- className
947
- ),
948
- ...props
949
- }
950
- );
951
- }
952
-
953
- // src/components/Inputs/Checkbox/Checkbox.tsx
954
- import { Fragment as Fragment7, jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
955
- var CheckboxInput = ({ className, style, ...props }) => {
956
- const isEditable = props.isEditable ?? true;
957
- const isDisabled = props.isDisabled ?? false;
958
- const text = props.text ? props.text : "Subscribe";
959
- const [error, setError] = useState7(null);
960
- useEffect7(() => {
961
- if (!props.validateOnMount) return;
962
- setError(props.errorMessage || null);
963
- }, [props.errorMessage, props.validateOnMount]);
964
- const handleChange = (value) => {
965
- props.onChange?.(value);
966
- };
967
- return /* @__PURE__ */ jsxs11(Fragment7, { children: [
968
- /* @__PURE__ */ jsx22("div", { className, style, children: /* @__PURE__ */ jsxs11("div", { className: "flex items-center space-x-2", children: [
969
- /* @__PURE__ */ jsx22(
970
- Checkbox,
971
- {
972
- id: props.name || "checkbox",
973
- checked: !!props.value,
974
- onCheckedChange: handleChange,
975
- disabled: !isEditable || isDisabled
976
- }
977
- ),
978
- /* @__PURE__ */ jsx22(Label2, { htmlFor: props.name || "checkbox", children: text })
979
- ] }) }),
980
- error && /* @__PURE__ */ jsx22("p", { className: "mt-1 text-xs text-red-500", children: error })
981
- ] });
982
- };
983
- var Checkbox_default = CheckboxInput;
984
-
985
- // src/components/Inputs/RadioInput/RadioInput.tsx
986
- import { useEffect as useEffect8, useState as useState8 } from "react";
987
-
988
- // src/components/ui/radio-group.tsx
989
- import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
990
- import { jsx as jsx23 } from "react/jsx-runtime";
991
- function RadioGroup2({
992
- className,
993
- ...props
994
- }) {
995
- return /* @__PURE__ */ jsx23(
996
- RadioGroupPrimitive.Root,
997
- {
998
- "data-slot": "radio-group",
999
- className: cn("grid gap-3", className),
1000
- ...props
1001
- }
1002
- );
1003
- }
1004
- function RadioGroupItem({
1005
- className,
1006
- ...props
1007
- }) {
1008
- return /* @__PURE__ */ jsx23(
1009
- RadioGroupPrimitive.Item,
1010
- {
1011
- "data-slot": "radio-group-item",
1012
- className: cn(
1013
- "border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
1014
- className
1015
- ),
1016
- ...props,
1017
- children: /* @__PURE__ */ jsx23(
1018
- RadioGroupPrimitive.Indicator,
1019
- {
1020
- "data-slot": "radio-group-indicator",
1021
- className: "relative flex items-center justify-center",
1022
- children: /* @__PURE__ */ jsx23(Circle, { className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2" })
1023
- }
1024
- )
1025
- }
1026
- );
1027
- }
1028
-
1029
- // src/components/Inputs/RadioInput/RadioInput.tsx
1030
- import { Fragment as Fragment8, jsx as jsx24, jsxs as jsxs12 } from "react/jsx-runtime";
1031
- var RadioInput = ({
1032
- className,
1033
- style,
1034
- defaultValue,
1035
- onChange,
1036
- data = [],
1037
- dataKey,
1038
- dataLabel,
1039
- ...props
1040
- }) => {
1041
- const [error, setError] = useState8(null);
1042
- useEffect8(() => {
1043
- if (!props.validateOnMount) return;
1044
- setError(props.errorMessage || null);
1045
- }, [props.errorMessage, props.validateOnMount]);
1046
- const options = (data || []).map((item) => ({
1047
- value: item[dataKey || "value"],
1048
- label: item[dataLabel || "label"]
1049
- }));
1050
- const handleChange = (value) => {
1051
- onChange?.(value);
1052
- };
1053
- const resolvedDefaultValue = (typeof defaultValue === "string" ? defaultValue : void 0) ?? options[0]?.value;
1054
- return /* @__PURE__ */ jsxs12(Fragment8, { children: [
1055
- /* @__PURE__ */ jsx24("div", { className, style, children: /* @__PURE__ */ jsxs12(
1056
- RadioGroup2,
1057
- {
1058
- defaultValue: resolvedDefaultValue,
1059
- onValueChange: handleChange,
1060
- children: [
1061
- options.length === 0 && /* @__PURE__ */ jsx24("div", { className: "text-sm text-gray-500", children: "No options available" }),
1062
- options.map((item) => /* @__PURE__ */ jsxs12("div", { className: "flex items-center space-x-2", children: [
1063
- /* @__PURE__ */ jsx24(RadioGroupItem, { value: item.value, id: `radio-${item.value}` }),
1064
- /* @__PURE__ */ jsx24(Label2, { htmlFor: `radio-${item.value}`, children: item.label })
1065
- ] }, item.value))
1066
- ]
1067
- }
1068
- ) }),
1069
- error && /* @__PURE__ */ jsx24("p", { className: "mt-1 text-xs text-red-500", children: error })
1070
- ] });
1071
- };
1072
- var RadioInput_default = RadioInput;
1073
-
1074
- // src/components/Inputs/MultiCheckbox/MultiCheckbox.tsx
1075
- import { useCallback, useState as useState9 } from "react";
1076
- import { jsx as jsx25, jsxs as jsxs13 } from "react/jsx-runtime";
1077
- var MultiCheckbox = ({
1078
- className,
1079
- style,
1080
- data = [],
1081
- dataKey = "value",
1082
- dataLabel = "label",
1083
- value: propValue = {},
1084
- onChange,
1085
- isEditable = true,
1086
- isDisabled = false
1087
- }) => {
1088
- const [value, setValue] = useState9(propValue);
1089
- const options = (data || []).map((item) => ({
1090
- value: item[dataKey || "value"],
1091
- label: item[dataLabel || "label"]
1092
- }));
1093
- const handleChange = useCallback(
1094
- (key, checked) => {
1095
- setValue((prev) => {
1096
- const newValue = { ...prev, [key]: checked };
1097
- onChange?.(newValue);
1098
- return newValue;
1099
- });
1100
- },
1101
- [onChange]
1102
- );
1103
- return /* @__PURE__ */ jsxs13(
1104
- "div",
1105
- {
1106
- className: cn("flex flex-col gap-3", className),
1107
- style,
1108
- children: [
1109
- options.length === 0 && /* @__PURE__ */ jsx25("p", { className: "text-sm text-gray-500", children: "No options available." }),
1110
- options.map((opt) => /* @__PURE__ */ jsxs13("div", { className: "flex items-center space-x-2", children: [
1111
- /* @__PURE__ */ jsx25(
1112
- Checkbox,
1113
- {
1114
- id: opt.value,
1115
- checked: !!value[opt.value],
1116
- onCheckedChange: (checked) => handleChange(opt.value, checked === true),
1117
- disabled: !isEditable || isDisabled
1118
- }
1119
- ),
1120
- /* @__PURE__ */ jsx25(Label2, { htmlFor: opt.value, children: opt.label })
1121
- ] }, opt.value))
1122
- ]
1123
- }
1124
- );
1125
- };
1126
- var MultiCheckbox_default = MultiCheckbox;
1127
-
1128
- // src/components/Inputs/RichText/RichText.tsx
1129
- import { useEffect as useEffect9, useState as useState10 } from "react";
1130
-
1131
- // src/components/Global/TinyMceEditor.tsx
1132
- import { useMemo, useRef } from "react";
1133
- import { Editor } from "@tinymce/tinymce-react";
1134
- import { jsx as jsx26 } from "react/jsx-runtime";
1135
- function MyEditor({
1136
- value,
1137
- onChange,
1138
- isDefault
1139
- }) {
1140
- const editorRef = useRef(null);
1141
- function stripOuterP(html) {
1142
- const trimmedHtml = html.trim();
1143
- if (!trimmedHtml) return "";
1144
- const div = document.createElement("div");
1145
- div.innerHTML = trimmedHtml;
1146
- const firstChild = div.firstElementChild;
1147
- if (div.childElementCount === 1 && firstChild?.tagName === "P") {
1148
- return firstChild.innerHTML;
1149
- }
1150
- return trimmedHtml;
1151
- }
1152
- const isDefaultToolbar = useMemo(() => {
1153
- let toolbar = "undo redo | formatselect | bold italic forecolor";
1154
- if (isDefault) {
1155
- toolbar = "undo redo | blocks | bold italic forecolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help";
1156
- }
1157
- return toolbar;
1158
- }, [isDefault]);
1159
- return /* @__PURE__ */ jsx26(
1160
- Editor,
1161
- {
1162
- apiKey: process.env.NEXT_PUBLIC_TINYMCE_API_KEY,
1163
- tinymceScriptSrc: process.env.NEXT_PUBLIC_TINYMCE_SCRIPT_SRC,
1164
- onInit: (_evt, editor) => editorRef.current = editor,
1165
- value,
1166
- licenseKey: "gpl",
1167
- init: {
1168
- height: 300,
1169
- menubar: false,
1170
- forced_root_block: false,
1171
- plugins: [
1172
- "advlist",
1173
- "autolink",
1174
- "lists",
1175
- "link",
1176
- "image",
1177
- "charmap",
1178
- "preview",
1179
- "anchor",
1180
- "searchreplace",
1181
- "visualblocks",
1182
- "code",
1183
- "fullscreen",
1184
- "insertdatetime",
1185
- "media",
1186
- "table",
1187
- "help",
1188
- "wordcount"
1189
- ],
1190
- toolbar: isDefaultToolbar,
1191
- content_style: `
1192
- body {
1193
- outline: none;
1194
- }
1195
- `
1196
- },
1197
- onEditorChange: (content) => onChange?.(stripOuterP(content))
1198
- }
1199
- );
1200
- }
1201
-
1202
- // src/components/Inputs/RichText/RichText.tsx
1203
- import { jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
1204
- function RichText({ className, style, ...props }) {
1205
- const [error, setError] = useState10(null);
1206
- useEffect9(() => {
1207
- if (!props.validateOnMount) return;
1208
- setError(props.errorMessage || null);
1209
- }, [props.errorMessage, props.validateOnMount]);
1210
- return /* @__PURE__ */ jsxs14(
1211
- "div",
1212
- {
1213
- className: cn(className, error ? "border-red-500" : ""),
1214
- style: {
1215
- ...style,
1216
- borderColor: error ? "#f87171" : style?.borderColor
1217
- },
1218
- children: [
1219
- /* @__PURE__ */ jsx27(MyEditor, { onChange: (content) => props.onChange?.(content), value: props.value, isDefault: true }),
1220
- error && /* @__PURE__ */ jsx27("p", { className: "mt-1 text-xs text-red-500", children: error })
1221
- ]
1222
- }
1223
- );
1224
- }
1225
-
1226
- // src/components/Inputs/Dropdown/Dropdown.tsx
1227
- import * as React8 from "react";
1228
-
1229
- // src/components/ui/select.tsx
1230
- import * as SelectPrimitive from "@radix-ui/react-select";
1231
- import { jsx as jsx28, jsxs as jsxs15 } from "react/jsx-runtime";
1232
- function Select({
1233
- ...props
1234
- }) {
1235
- return /* @__PURE__ */ jsx28(SelectPrimitive.Root, { "data-slot": "select", ...props });
1236
- }
1237
- function SelectValue({
1238
- ...props
1239
- }) {
1240
- return /* @__PURE__ */ jsx28(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
1241
- }
1242
- function SelectTrigger({
1243
- className,
1244
- size = "default",
1245
- children,
1246
- ...props
1247
- }) {
1248
- return /* @__PURE__ */ jsxs15(
1249
- SelectPrimitive.Trigger,
1250
- {
1251
- "data-slot": "select-trigger",
1252
- "data-size": size,
1253
- className: cn(
1254
- "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
1255
- className
1256
- ),
1257
- ...props,
1258
- children: [
1259
- children,
1260
- /* @__PURE__ */ jsx28(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx28(ChevronDown, { className: "size-4 opacity-50" }) })
1261
- ]
1262
- }
1263
- );
1264
- }
1265
- function SelectContent({
1266
- className,
1267
- children,
1268
- position = "popper",
1269
- ...props
1270
- }) {
1271
- return /* @__PURE__ */ jsx28(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs15(
1272
- SelectPrimitive.Content,
1273
- {
1274
- "data-slot": "select-content",
1275
- className: cn(
1276
- "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
1277
- position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
1278
- className
1279
- ),
1280
- position,
1281
- ...props,
1282
- children: [
1283
- /* @__PURE__ */ jsx28(SelectScrollUpButton, {}),
1284
- /* @__PURE__ */ jsx28(
1285
- SelectPrimitive.Viewport,
1286
- {
1287
- className: cn(
1288
- "p-1",
1289
- position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
1290
- ),
1291
- children
1292
- }
1293
- ),
1294
- /* @__PURE__ */ jsx28(SelectScrollDownButton, {})
1295
- ]
1296
- }
1297
- ) });
1298
- }
1299
- function SelectItem({
1300
- className,
1301
- children,
1302
- ...props
1303
- }) {
1304
- return /* @__PURE__ */ jsxs15(
1305
- SelectPrimitive.Item,
1306
- {
1307
- "data-slot": "select-item",
1308
- className: cn(
1309
- "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
1310
- className
1311
- ),
1312
- ...props,
1313
- children: [
1314
- /* @__PURE__ */ jsx28("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx28(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx28(Check, { className: "size-4" }) }) }),
1315
- /* @__PURE__ */ jsx28(SelectPrimitive.ItemText, { children })
1316
- ]
1317
- }
1318
- );
1319
- }
1320
- function SelectScrollUpButton({
1321
- className,
1322
- ...props
1323
- }) {
1324
- return /* @__PURE__ */ jsx28(
1325
- SelectPrimitive.ScrollUpButton,
1326
- {
1327
- "data-slot": "select-scroll-up-button",
1328
- className: cn(
1329
- "flex cursor-default items-center justify-center py-1",
1330
- className
1331
- ),
1332
- ...props,
1333
- children: /* @__PURE__ */ jsx28(ChevronUp, { className: "size-4" })
1334
- }
1335
- );
1336
- }
1337
- function SelectScrollDownButton({
1338
- className,
1339
- ...props
1340
- }) {
1341
- return /* @__PURE__ */ jsx28(
1342
- SelectPrimitive.ScrollDownButton,
1343
- {
1344
- "data-slot": "select-scroll-down-button",
1345
- className: cn(
1346
- "flex cursor-default items-center justify-center py-1",
1347
- className
1348
- ),
1349
- ...props,
1350
- children: /* @__PURE__ */ jsx28(ChevronDown, { className: "size-4" })
1351
- }
1352
- );
1353
- }
1354
-
1355
- // src/components/Inputs/Dropdown/Dropdown.tsx
1356
- import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
1357
- var Dropdown = ({ className, style, ...props }) => {
1358
- const list = props.data || [];
1359
- const placeholder = props.placeholder ? props.placeholder : "Placeholder text";
1360
- const isEditable = props.isEditable ?? true;
1361
- const isDisabled = props.isDisabled ?? false;
1362
- const isReadonly = props.isReadonly ?? false;
1363
- const [error, setError] = React8.useState(null);
1364
- React8.useEffect(() => {
1365
- if (!props.validateOnMount) return;
1366
- setError(props.errorMessage || null);
1367
- }, [props.errorMessage, props.validateOnMount]);
1368
- const handleChange = (value) => {
1369
- props.onChange?.(value);
1370
- };
1371
- const dataKey = props.dataKey || "value";
1372
- const dataLabel = props.dataLabel || "label";
1373
- const options = list.map((item) => ({
1374
- value: item[dataKey],
1375
- label: item[dataLabel]
1376
- }));
1377
- return /* @__PURE__ */ jsxs16(Fragment9, { children: [
1378
- /* @__PURE__ */ jsxs16(Select, { name: props.name, value: props.value, onValueChange: handleChange, disabled: isDisabled || !isEditable, children: [
1379
- /* @__PURE__ */ jsx29(
1380
- SelectTrigger,
1381
- {
1382
- id: props.name || "select-field",
1383
- className: cn(className, error ? "border-red-500" : ""),
1384
- style: {
1385
- ...style,
1386
- borderColor: error ? "#f87171" : style?.borderColor
1387
- },
1388
- "aria-readonly": isReadonly,
1389
- children: /* @__PURE__ */ jsx29(SelectValue, { placeholder })
1390
- }
1391
- ),
1392
- /* @__PURE__ */ jsx29(SelectContent, { children: options.map((opt) => /* @__PURE__ */ jsx29(SelectItem, { value: opt.value, children: opt.label }, opt.value)) })
1393
- ] }),
1394
- error && /* @__PURE__ */ jsx29("p", { className: "mt-1 text-xs text-red-500", children: error })
1395
- ] });
1396
- };
1397
- var Dropdown_default = Dropdown;
1398
-
1399
- // src/components/Inputs/SwitchToggle/SwitchToggle.tsx
1400
- import { useEffect as useEffect11, useState as useState12 } from "react";
1401
-
1402
- // src/components/ui/switch.tsx
1403
- import * as SwitchPrimitive from "@radix-ui/react-switch";
1404
- import { jsx as jsx30 } from "react/jsx-runtime";
1405
- function Switch({
1406
- className,
1407
- ...props
1408
- }) {
1409
- return /* @__PURE__ */ jsx30(
1410
- SwitchPrimitive.Root,
1411
- {
1412
- "data-slot": "switch",
1413
- className: cn(
1414
- "peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
1415
- className
1416
- ),
1417
- ...props,
1418
- children: /* @__PURE__ */ jsx30(
1419
- SwitchPrimitive.Thumb,
1420
- {
1421
- "data-slot": "switch-thumb",
1422
- className: cn(
1423
- "bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
1424
- )
1425
- }
1426
- )
1427
- }
1428
- );
1429
- }
1430
-
1431
- // src/components/Inputs/SwitchToggle/SwitchToggle.tsx
1432
- import { Fragment as Fragment10, jsx as jsx31, jsxs as jsxs17 } from "react/jsx-runtime";
1433
- var SwitchToggle = ({ className, style, ...props }) => {
1434
- const isEditable = props.isEditable ?? true;
1435
- const isDisabled = props.isDisabled ?? false;
1436
- const [error, setError] = useState12(null);
1437
- useEffect11(() => {
1438
- if (!props.validateOnMount) return;
1439
- setError(props.errorMessage || null);
1440
- }, [props.errorMessage, props.validateOnMount]);
1441
- const handleChange = (value) => {
1442
- props.onChange?.(value);
1443
- };
1444
- return /* @__PURE__ */ jsxs17(Fragment10, { children: [
1445
- /* @__PURE__ */ jsx31("div", { className, style, children: /* @__PURE__ */ jsxs17("div", { className: "flex items-center space-x-2 mb-2", children: [
1446
- /* @__PURE__ */ jsx31(
1447
- Switch,
1448
- {
1449
- id: props.name || "switch",
1450
- checked: !!props.value,
1451
- onCheckedChange: handleChange,
1452
- disabled: isDisabled || !isEditable
1453
- }
1454
- ),
1455
- /* @__PURE__ */ jsx31(Label2, { htmlFor: props.name || "switch", children: props.text })
1456
- ] }) }),
1457
- error && /* @__PURE__ */ jsx31("p", { className: "mt-1 text-xs text-red-500", children: error })
1458
- ] });
1459
- };
1460
- var SwitchToggle_default = SwitchToggle;
1461
-
1462
- // src/components/Inputs/PhoneInput/PhoneInput.tsx
1463
- import * as React9 from "react";
1464
- import { PhoneInput as PhoneInputField } from "react-international-phone";
1465
- import "react-international-phone/style.css";
1466
- import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
1467
- var PhoneInput = ({ className, style, ...props }) => {
1468
- const placeholder = props.placeholder ?? "Enter phone number";
1469
- const isEditable = props.isEditable ?? true;
1470
- const isDisabled = props.isDisabled ?? false;
1471
- const [error, setError] = React9.useState(null);
1472
- React9.useEffect(() => {
1473
- if (!props.validateOnMount) return;
1474
- setError(props.errorMessage || null);
1475
- }, [props.errorMessage, props.validateOnMount]);
1476
- const handleChange = (val) => {
1477
- props.onChange?.(val);
1478
- };
1479
- return /* @__PURE__ */ jsxs18(Fragment11, { children: [
1480
- /* @__PURE__ */ jsx32(
1481
- PhoneInputField,
1482
- {
1483
- defaultCountry: "in",
1484
- name: props.name,
1485
- value: props.value,
1486
- className: cn(className, error ? "border-red-500" : ""),
1487
- style: {
1488
- ...style,
1489
- borderColor: error ? "#f87171" : style?.borderColor
1490
- },
1491
- onChange: (phone) => handleChange(phone),
1492
- inputProps: {
1493
- id: "phone-field"
1494
- },
1495
- placeholder,
1496
- disabled: isDisabled || !isEditable
1497
- }
1498
- ),
1499
- error && /* @__PURE__ */ jsx32("p", { className: "mt-1 text-xs text-red-500", children: error })
1500
- ] });
1501
- };
1502
- var PhoneInput_default = PhoneInput;
1503
-
1504
- // src/components/Inputs/SearchInput/SearchInput.tsx
1505
- import * as React10 from "react";
1506
- import { Fragment as Fragment12, jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
1507
- var SearchInput = ({ className, style, ...props }) => {
1508
- const placeholder = props.placeholder ?? "Placeholder text";
1509
- const isEditable = props.isEditable ?? true;
1510
- const isDisabled = props.isDisabled ?? false;
1511
- const isReadonly = props.isReadonly ?? false;
1512
- const isAutocomplete = props.isAutocomplete ?? false;
1513
- const [error, setError] = React10.useState(null);
1514
- React10.useEffect(() => {
1515
- if (!props.validateOnMount) return;
1516
- setError(props.errorMessage || null);
1517
- }, [props.errorMessage, props.validateOnMount]);
1518
- const handleChange = (e) => {
1519
- props.onChange?.(e);
1520
- };
1521
- return /* @__PURE__ */ jsxs19(Fragment12, { children: [
1522
- /* @__PURE__ */ jsxs19("div", { className: "flex justify-start items-center relative", children: [
1523
- /* @__PURE__ */ jsx33(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
1524
- /* @__PURE__ */ jsx33(
1525
- Input,
1526
- {
1527
- type: "text",
1528
- id: props.name || "text-field",
1529
- name: props.name,
1530
- value: props.value,
1531
- className: cn(className, error ? "border-red-500" : ""),
1532
- style: {
1533
- ...style,
1534
- borderColor: error ? "#f87171" : style?.borderColor
1535
- },
1536
- autoComplete: isAutocomplete ? "on" : "off",
1537
- placeholder,
1538
- onChange: handleChange,
1539
- disabled: isDisabled || !isEditable,
1540
- readOnly: isReadonly
1541
- }
1542
- )
1543
- ] }),
1544
- error && /* @__PURE__ */ jsx33("p", { className: "mt-1 text-xs text-red-500", children: error })
1545
- ] });
1546
- };
1547
- var SearchInput_default = SearchInput;
1548
-
1549
- // src/components/Inputs/FileInput/FileInput.tsx
1550
- import { useEffect as useEffect14, useState as useState15 } from "react";
1551
- import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
1552
- var FileInput = ({ className, style, ...props }) => {
1553
- const placeholder = props.placeholder ?? "Placeholder text";
1554
- const [error, setError] = useState15(null);
1555
- useEffect14(() => {
1556
- if (!props.validateOnMount) return;
1557
- setError(props.errorMessage || null);
1558
- }, [props.errorMessage, props.validateOnMount]);
1559
- return /* @__PURE__ */ jsxs20("div", { className: "d-flex items-center relative align-middle", children: [
1560
- /* @__PURE__ */ jsx34(
1561
- Input,
1562
- {
1563
- type: "file",
1564
- id: "file",
1565
- name: props.name,
1566
- value: props.value,
1567
- className: cn(className, error ? "border-red-500" : ""),
1568
- style: {
1569
- ...style,
1570
- borderColor: error ? "#f87171" : style?.borderColor
1571
- },
1572
- autoComplete: "off",
1573
- placeholder,
1574
- onChange: (e) => {
1575
- props.onChange?.(e);
1576
- }
1577
- }
1578
- ),
1579
- error && /* @__PURE__ */ jsx34("p", { className: "mt-1 text-xs text-red-500", children: error })
1580
- ] });
1581
- };
1582
- var FileInput_default = FileInput;
1583
-
1584
- // src/components/Inputs/DatePicker/DatePicker.tsx
1585
- import React11, { useEffect as useEffect15 } from "react";
1586
- import { Fragment as Fragment13, jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
1587
- function DatePicker({ className, style, ...props }) {
1588
- const placeholder = props.placeholder ?? "Placeholder text";
1589
- const minimumDate = props.minimumDate ?? "none";
1590
- const customMinimumDate = props.customMinimumDate ?? "";
1591
- const maximumDate = props.maximumDate ?? "none";
1592
- const customMaximumDate = props.customMaximumDate ?? "";
1593
- const isEditable = props.isEditable ?? true;
1594
- const isDisabled = props.isDisabled ?? false;
1595
- const isReadonly = props.isReadonly ?? false;
1596
- const isAutocomplete = props.isAutocomplete ?? false;
1597
- const [error, setError] = React11.useState(null);
1598
- const resolveDate = (option, customOption) => {
1599
- if (!option) return void 0;
1600
- switch (option) {
1601
- case "today":
1602
- return (/* @__PURE__ */ new Date()).toISOString().split("T")[0];
1603
- case "custom":
1604
- return customOption ?? void 0;
1605
- case "none":
1606
- default:
1607
- return void 0;
1608
- }
1609
- };
1610
- const minDate = resolveDate(minimumDate, customMinimumDate);
1611
- const maxDate = resolveDate(maximumDate, customMaximumDate);
1612
- useEffect15(() => {
1613
- if (!props.validateOnMount) return;
1614
- setError(props.errorMessage || null);
1615
- }, [props.errorMessage, props.validateOnMount]);
1616
- const handleChange = (e) => {
1617
- props.onChange?.(e);
1618
- };
1619
- return /* @__PURE__ */ jsxs21(Fragment13, { children: [
1620
- /* @__PURE__ */ jsxs21("div", { className: "flex justify-start items-center relative", children: [
1621
- /* @__PURE__ */ jsx35(Calendar, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#BDBDBD]" }),
1622
- /* @__PURE__ */ jsx35(
1623
- Input,
1624
- {
1625
- type: "date",
1626
- id: "date",
1627
- autoComplete: isAutocomplete ? "on" : "off",
1628
- onChange: handleChange,
1629
- disabled: isDisabled || !isEditable,
1630
- name: props.name,
1631
- value: props.value,
1632
- className: cn(
1633
- className,
1634
- error ? "border-red-500" : "",
1635
- "appearance-auto"
1636
- ),
1637
- style: {
1638
- ...style,
1639
- borderColor: error ? "#f87171" : style?.borderColor
1640
- },
1641
- readOnly: isReadonly,
1642
- placeholder,
1643
- min: minDate,
1644
- max: maxDate
1645
- }
1646
- )
1647
- ] }),
1648
- error && /* @__PURE__ */ jsx35("p", { className: "mt-1 text-xs text-red-500", children: error })
1649
- ] });
1650
- }
1651
-
1652
- // src/components/Inputs/DateRange/DateRange.tsx
1653
- import * as React13 from "react";
1654
- import { addDays, format } from "date-fns";
1655
-
1656
- // src/components/ui/calendar.tsx
1657
- import * as React12 from "react";
1658
- import { DayPicker, getDefaultClassNames } from "react-day-picker";
1659
- import { jsx as jsx36 } from "react/jsx-runtime";
1660
- function Calendar2({
1661
- className,
1662
- classNames,
1663
- showOutsideDays = true,
1664
- captionLayout = "label",
1665
- buttonVariant = "ghost",
1666
- formatters,
1667
- components,
1668
- ...props
1669
- }) {
1670
- const defaultClassNames = getDefaultClassNames();
1671
- return /* @__PURE__ */ jsx36(
1672
- DayPicker,
1673
- {
1674
- showOutsideDays,
1675
- className: cn(
1676
- "bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
1677
- String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
1678
- String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
1679
- className
1680
- ),
1681
- captionLayout,
1682
- formatters: {
1683
- formatMonthDropdown: (date) => date.toLocaleString("default", { month: "short" }),
1684
- ...formatters
1685
- },
1686
- classNames: {
1687
- root: cn("w-fit", defaultClassNames.root),
1688
- months: cn(
1689
- "flex gap-4 flex-col md:flex-row relative",
1690
- defaultClassNames.months
1691
- ),
1692
- month: cn("flex flex-col w-full gap-4", defaultClassNames.month),
1693
- nav: cn(
1694
- "flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between",
1695
- defaultClassNames.nav
1696
- ),
1697
- button_previous: cn(
1698
- buttonVariants({ variant: buttonVariant }),
1699
- "size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
1700
- defaultClassNames.button_previous
1701
- ),
1702
- button_next: cn(
1703
- buttonVariants({ variant: buttonVariant }),
1704
- "size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
1705
- defaultClassNames.button_next
1706
- ),
1707
- month_caption: cn(
1708
- "flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)",
1709
- defaultClassNames.month_caption
1710
- ),
1711
- dropdowns: cn(
1712
- "w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5",
1713
- defaultClassNames.dropdowns
1714
- ),
1715
- dropdown_root: cn(
1716
- "relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] rounded-md",
1717
- defaultClassNames.dropdown_root
1718
- ),
1719
- dropdown: cn(
1720
- "absolute bg-popover inset-0 opacity-0",
1721
- defaultClassNames.dropdown
1722
- ),
1723
- caption_label: cn(
1724
- "select-none font-medium",
1725
- captionLayout === "label" ? "text-sm" : "rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5",
1726
- defaultClassNames.caption_label
1727
- ),
1728
- table: "w-full border-collapse",
1729
- weekdays: cn("flex", defaultClassNames.weekdays),
1730
- weekday: cn(
1731
- "text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none",
1732
- defaultClassNames.weekday
1733
- ),
1734
- week: cn("flex w-full mt-2", defaultClassNames.week),
1735
- week_number_header: cn(
1736
- "select-none w-(--cell-size)",
1737
- defaultClassNames.week_number_header
1738
- ),
1739
- week_number: cn(
1740
- "text-[0.8rem] select-none text-muted-foreground",
1741
- defaultClassNames.week_number
1742
- ),
1743
- day: cn(
1744
- "relative w-full h-full p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none",
1745
- defaultClassNames.day
1746
- ),
1747
- range_start: cn(
1748
- "rounded-l-md bg-accent",
1749
- defaultClassNames.range_start
1750
- ),
1751
- range_middle: cn("rounded-none", defaultClassNames.range_middle),
1752
- range_end: cn("rounded-r-md bg-accent", defaultClassNames.range_end),
1753
- today: cn(
1754
- "bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none",
1755
- defaultClassNames.today
1756
- ),
1757
- outside: cn(
1758
- "text-muted-foreground aria-selected:text-muted-foreground",
1759
- defaultClassNames.outside
1760
- ),
1761
- disabled: cn(
1762
- "text-muted-foreground opacity-50",
1763
- defaultClassNames.disabled
1764
- ),
1765
- hidden: cn("invisible", defaultClassNames.hidden),
1766
- ...classNames
1767
- },
1768
- components: {
1769
- Root: ({ className: className2, rootRef, ...props2 }) => {
1770
- return /* @__PURE__ */ jsx36(
1771
- "div",
1772
- {
1773
- "data-slot": "calendar",
1774
- ref: rootRef,
1775
- className: cn(className2),
1776
- ...props2
1777
- }
1778
- );
1779
- },
1780
- Chevron: ({ className: className2, orientation, ...props2 }) => {
1781
- if (orientation === "left") {
1782
- return /* @__PURE__ */ jsx36(ChevronLeft, { className: cn("size-4", className2), ...props2 });
1783
- }
1784
- if (orientation === "right") {
1785
- return /* @__PURE__ */ jsx36(
1786
- ChevronRight,
1787
- {
1788
- className: cn("size-4", className2),
1789
- ...props2
1790
- }
1791
- );
1792
- }
1793
- return /* @__PURE__ */ jsx36(ChevronDown, { className: cn("size-4", className2), ...props2 });
1794
- },
1795
- DayButton: CalendarDayButton,
1796
- WeekNumber: ({ children, ...props2 }) => {
1797
- return /* @__PURE__ */ jsx36("td", { ...props2, children: /* @__PURE__ */ jsx36("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) });
1798
- },
1799
- ...components
1800
- },
1801
- ...props
1802
- }
1803
- );
1804
- }
1805
- function CalendarDayButton({
1806
- className,
1807
- day,
1808
- modifiers,
1809
- ...props
1810
- }) {
1811
- const defaultClassNames = getDefaultClassNames();
1812
- const ref = React12.useRef(null);
1813
- React12.useEffect(() => {
1814
- if (modifiers.focused) ref.current?.focus();
1815
- }, [modifiers.focused]);
1816
- return /* @__PURE__ */ jsx36(
1817
- Button,
1818
- {
1819
- ref,
1820
- variant: "ghost",
1821
- size: "icon",
1822
- "data-day": day.date.toLocaleDateString(),
1823
- "data-selected-single": modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle,
1824
- "data-range-start": modifiers.range_start,
1825
- "data-range-end": modifiers.range_end,
1826
- "data-range-middle": modifiers.range_middle,
1827
- className: cn(
1828
- "data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70",
1829
- defaultClassNames.day,
1830
- className
1831
- ),
1832
- ...props
1833
- }
1834
- );
1835
- }
1836
-
1837
- // src/components/ui/popover.tsx
1838
- import * as PopoverPrimitive from "@radix-ui/react-popover";
1839
- import { jsx as jsx37 } from "react/jsx-runtime";
1840
- function Popover({
1841
- ...props
1842
- }) {
1843
- return /* @__PURE__ */ jsx37(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
1844
- }
1845
- function PopoverTrigger({
1846
- ...props
1847
- }) {
1848
- return /* @__PURE__ */ jsx37(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
1849
- }
1850
- function PopoverContent({
1851
- className,
1852
- align = "center",
1853
- sideOffset = 4,
1854
- ...props
1855
- }) {
1856
- return /* @__PURE__ */ jsx37(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx37(
1857
- PopoverPrimitive.Content,
1858
- {
1859
- "data-slot": "popover-content",
1860
- align,
1861
- sideOffset,
1862
- className: cn(
1863
- "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
1864
- className
1865
- ),
1866
- ...props
1867
- }
1868
- ) });
1869
- }
1870
-
1871
- // src/components/Inputs/DateRange/DateRange.tsx
1872
- import { Fragment as Fragment14, jsx as jsx38, jsxs as jsxs22 } from "react/jsx-runtime";
1873
- var DateRange = ({ className, style, ...props }) => {
1874
- const [error, setError] = React13.useState(null);
1875
- const isDateRange = (val) => !!val && val.from instanceof Date;
1876
- const [date, setDate] = React13.useState(
1877
- isDateRange(props.value) ? props.value : {
1878
- from: /* @__PURE__ */ new Date(),
1879
- to: addDays(/* @__PURE__ */ new Date(), 7)
1880
- }
1881
- );
1882
- React13.useEffect(() => {
1883
- if (!props.validateOnMount) return;
1884
- setError(props.errorMessage || null);
1885
- }, [props.errorMessage, props.validateOnMount]);
1886
- const handleChange = (value) => {
1887
- setDate(value);
1888
- if (value) {
1889
- props.onChange?.(value);
1890
- }
1891
- };
1892
- return /* @__PURE__ */ jsxs22(Fragment14, { children: [
1893
- /* @__PURE__ */ jsx38("div", { className, style, children: /* @__PURE__ */ jsxs22(Popover, { children: [
1894
- /* @__PURE__ */ jsx38(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx38(
1895
- Button,
1896
- {
1897
- id: "date",
1898
- variant: "outline",
1899
- className: cn(
1900
- "w-[300px] justify-start text-left font-normal text-[11px]",
1901
- !date && "text-muted-foreground"
1902
- ),
1903
- children: date?.from ? date.to ? /* @__PURE__ */ jsxs22(Fragment14, { children: [
1904
- format(date.from, "LLL dd, y"),
1905
- " -",
1906
- " ",
1907
- format(date.to, "LLL dd, y")
1908
- ] }) : format(date.from, "LLL dd, y") : /* @__PURE__ */ jsx38("span", { children: "Pick a date range" })
1909
- }
1910
- ) }),
1911
- /* @__PURE__ */ jsx38(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx38(
1912
- Calendar2,
1913
- {
1914
- mode: "range",
1915
- defaultMonth: date?.from,
1916
- selected: date,
1917
- onSelect: handleChange,
1918
- numberOfMonths: 2
1919
- }
1920
- ) })
1921
- ] }) }),
1922
- error && /* @__PURE__ */ jsx38("p", { className: "mt-1 text-xs text-red-500", children: error })
1923
- ] });
1924
- };
1925
- var DateRange_default = DateRange;
1926
-
1927
- // src/components/Inputs/TextInputGroup/TextInputGroup.tsx
1928
- import * as React14 from "react";
1929
- import { Fragment as Fragment15, jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
1930
- var TextInputGroup = ({ className, style, prepend, append, ...props }) => {
1931
- const placeholder = props.placeholder ?? "Placeholder text";
1932
- const isEditable = props.isEditable ?? true;
1933
- const isDisabled = props.isDisabled ?? false;
1934
- const isReadonly = props.isReadonly ?? false;
1935
- const isAutocomplete = props.isAutocomplete ?? false;
1936
- const [error, setError] = React14.useState(null);
1937
- React14.useEffect(() => {
1938
- if (!props.validateOnMount) return;
1939
- setError(props.errorMessage || null);
1940
- }, [props.errorMessage, props.validateOnMount]);
1941
- const handleChange = (e) => {
1942
- props.onChange?.(e);
1943
- };
1944
- return /* @__PURE__ */ jsxs23(Fragment15, { children: [
1945
- /* @__PURE__ */ jsxs23(
1946
- "div",
1947
- {
1948
- className: cn(
1949
- "flex justify-start items-center relative border border-input rounded-md bg-transparent focus-within:ring-2 focus-within:ring-ring focus-within:border-primary",
1950
- className,
1951
- "p-0 m-0",
1952
- error ? "border-red-500" : ""
1953
- ),
1954
- children: [
1955
- prepend && /* @__PURE__ */ jsx39("div", { className: "px-3 flex items-center bg-gray-500 text-white h-10 rounded-l-md", children: prepend }),
1956
- /* @__PURE__ */ jsx39(
1957
- Input,
1958
- {
1959
- id: props.name || "prepend-input",
1960
- type: "url",
1961
- name: props.name,
1962
- value: props.value,
1963
- className: cn(
1964
- className,
1965
- "rounded-none flex-1 border-none focus:ring-0"
1966
- ),
1967
- style: {
1968
- ...style,
1969
- borderColor: error ? "#f87171" : style?.borderColor
1970
- },
1971
- autoComplete: isAutocomplete ? "on" : "off",
1972
- placeholder,
1973
- onChange: handleChange,
1974
- disabled: isDisabled || !isEditable,
1975
- readOnly: isReadonly
1976
- }
1977
- ),
1978
- append && /* @__PURE__ */ jsx39("div", { className: "px-3 flex items-center bg-gray-500 text-white h-10 rounded-r-md", children: append })
1979
- ]
1980
- }
1981
- ),
1982
- error && /* @__PURE__ */ jsx39("p", { className: "mt-1 text-xs text-red-500", children: error })
1983
- ] });
1984
- };
1985
- var TextInputGroup_default = TextInputGroup;
1986
-
1987
- // src/components/ui/data-table.tsx
1988
1
  import {
1989
- flexRender,
1990
- getCoreRowModel,
1991
- useReactTable
1992
- } from "@tanstack/react-table";
1993
-
1994
- // src/components/ui/table.tsx
1995
- import { jsx as jsx40 } from "react/jsx-runtime";
1996
- function Table({ className, ...props }) {
1997
- return /* @__PURE__ */ jsx40(
1998
- "div",
1999
- {
2000
- "data-slot": "table-container",
2001
- className: "relative w-full overflow-x-auto rounded-md border border-gray-200 bg-white",
2002
- children: /* @__PURE__ */ jsx40(
2003
- "table",
2004
- {
2005
- "data-slot": "table",
2006
- className: cn("w-full text-sm", className),
2007
- ...props
2008
- }
2009
- )
2010
- }
2011
- );
2012
- }
2013
- function TableHeader({ className, ...props }) {
2014
- return /* @__PURE__ */ jsx40(
2015
- "thead",
2016
- {
2017
- "data-slot": "table-header",
2018
- className: cn(
2019
- "bg-gray-100 text-gray-700 [&>tr]:border-b [&>tr]:border-gray-200 [&>tr>th]:border-r [&>tr>th]:border-gray-200 [&>tr>th]:last:border-r-0",
2020
- className
2021
- ),
2022
- ...props
2023
- }
2024
- );
2025
- }
2026
- function TableBody({ className, ...props }) {
2027
- return /* @__PURE__ */ jsx40(
2028
- "tbody",
2029
- {
2030
- "data-slot": "table-body",
2031
- className: cn(
2032
- "[&>tr]:border-b [&>tr]:border-gray-200 [&>tr:last-child]:border-0 [&>tr>td]:border-r [&>tr>td]:border-gray-200 [&>tr>td]:last:border-r-0",
2033
- className
2034
- ),
2035
- ...props
2036
- }
2037
- );
2038
- }
2039
- function TableRow({ className, ...props }) {
2040
- return /* @__PURE__ */ jsx40(
2041
- "tr",
2042
- {
2043
- "data-slot": "table-row",
2044
- className: cn(
2045
- "border-b border-gray-200 hover:bg-gray-50 transition-colors",
2046
- className
2047
- ),
2048
- ...props
2049
- }
2050
- );
2051
- }
2052
- function TableHead({ className, ...props }) {
2053
- return /* @__PURE__ */ jsx40(
2054
- "th",
2055
- {
2056
- "data-slot": "table-head",
2057
- className: cn(
2058
- "h-12 px-6 text-left align-middle font-semibold whitespace-nowrap",
2059
- className
2060
- ),
2061
- ...props
2062
- }
2063
- );
2064
- }
2065
- function TableCell({ className, ...props }) {
2066
- return /* @__PURE__ */ jsx40(
2067
- "td",
2068
- {
2069
- "data-slot": "table-cell",
2070
- className: cn(
2071
- "px-6 py-4 align-middle text-gray-700",
2072
- className
2073
- ),
2074
- ...props
2075
- }
2076
- );
2077
- }
2078
-
2079
- // src/components/ui/data-table.tsx
2080
- import { Fragment as Fragment16, jsx as jsx41, jsxs as jsxs24 } from "react/jsx-runtime";
2081
- function DataTable({
2082
- columns,
2083
- rowActions,
2084
- data,
2085
- loading,
2086
- getRowSelection,
2087
- onCellClick,
2088
- cellClickEnabled = () => false
2089
- }) {
2090
- const table = useReactTable({
2091
- data,
2092
- columns,
2093
- enableRowSelection: true,
2094
- onRowSelectionChange: getRowSelection ? (updaterOrValue) => {
2095
- const value = typeof updaterOrValue === "function" ? updaterOrValue(table.getState().rowSelection) : updaterOrValue;
2096
- getRowSelection(value);
2097
- } : void 0,
2098
- getCoreRowModel: getCoreRowModel()
2099
- });
2100
- const handleCellClick = (rowData, columnId) => {
2101
- if (onCellClick) {
2102
- onCellClick(rowData, columnId);
2103
- }
2104
- };
2105
- return /* @__PURE__ */ jsx41("div", { className: "overflow-hidden rounded-md border w-full", children: /* @__PURE__ */ jsxs24(Table, { children: [
2106
- /* @__PURE__ */ jsx41(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx41(TableRow, { children: headerGroup.headers.map((header) => {
2107
- return /* @__PURE__ */ jsx41(TableHead, { children: header.isPlaceholder ? null : flexRender(
2108
- header.column.columnDef.header,
2109
- header.getContext()
2110
- ) }, header.id);
2111
- }) }, headerGroup.id)) }),
2112
- /* @__PURE__ */ jsx41(TableBody, { children: loading ? /* @__PURE__ */ jsx41(TableRow, { children: /* @__PURE__ */ jsx41(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "Loading..." }) }) : /* @__PURE__ */ jsx41(Fragment16, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsxs24(
2113
- TableRow,
2114
- {
2115
- "data-state": row.getIsSelected() && "selected",
2116
- className: "relative group",
2117
- children: [
2118
- row.getVisibleCells().map((cell) => {
2119
- const isCellClickable = cellClickEnabled(row.original, cell.column.id);
2120
- const dynamicClass = cell.column.columnDef.meta?.cellClass || "";
2121
- const dynamicStyle = cell.column.columnDef.meta?.cellStyle || {};
2122
- return /* @__PURE__ */ jsx41(
2123
- TableCell,
2124
- {
2125
- className: `${dynamicClass} ${isCellClickable ? "underline cursor-pointer" : ""}`,
2126
- style: dynamicStyle,
2127
- onClick: () => {
2128
- if (isCellClickable) {
2129
- handleCellClick(row.original, cell.column.id);
2130
- }
2131
- },
2132
- children: flexRender(cell.column.columnDef.cell, cell.getContext())
2133
- },
2134
- cell.id
2135
- );
2136
- }),
2137
- rowActions.length > 0 && /* @__PURE__ */ jsx41("div", { className: "absolute top-0 right-0 bg-white py-3 min-w-[100px] z-50 shadow-md flex items-center justify-center gap-3 p-2 opacity-0 group-hover:opacity-100 duration-300 h-full", children: rowActions.map((action, index) => /* @__PURE__ */ jsx41("p", { className: "text-[#383838] text-[12px] cursor-pointer font-[400]", children: action.header }, index)) })
2138
- ]
2139
- },
2140
- row.id
2141
- )) : /* @__PURE__ */ jsx41(TableRow, { children: /* @__PURE__ */ jsx41(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) }) }) })
2142
- ] }) });
2143
- }
2144
-
2145
- // src/components/ui/pagination.tsx
2146
- import { jsx as jsx42, jsxs as jsxs25 } from "react/jsx-runtime";
2147
- function Pagination({ className, ...props }) {
2148
- return /* @__PURE__ */ jsx42(
2149
- "nav",
2150
- {
2151
- role: "navigation",
2152
- "aria-label": "pagination",
2153
- "data-slot": "pagination",
2154
- className: cn("mx-auto flex w-full justify-center", className),
2155
- ...props
2156
- }
2157
- );
2158
- }
2159
- function PaginationContent({
2160
- className,
2161
- ...props
2162
- }) {
2163
- return /* @__PURE__ */ jsx42(
2164
- "ul",
2165
- {
2166
- "data-slot": "pagination-content",
2167
- className: cn("flex flex-row items-center gap-1", className),
2168
- ...props
2169
- }
2170
- );
2171
- }
2172
- function PaginationItem({ ...props }) {
2173
- return /* @__PURE__ */ jsx42("li", { "data-slot": "pagination-item", ...props });
2174
- }
2175
- function PaginationLink({
2176
- className,
2177
- isActive,
2178
- size = "icon",
2179
- ...props
2180
- }) {
2181
- return /* @__PURE__ */ jsx42(
2182
- "a",
2183
- {
2184
- "aria-current": isActive ? "page" : void 0,
2185
- "data-slot": "pagination-link",
2186
- "data-active": isActive,
2187
- className: cn(
2188
- buttonVariants({
2189
- variant: isActive ? "outline" : "ghost",
2190
- size
2191
- }),
2192
- className
2193
- ),
2194
- ...props
2195
- }
2196
- );
2197
- }
2198
- function PaginationPrevious({
2199
- className,
2200
- ...props
2201
- }) {
2202
- return /* @__PURE__ */ jsxs25(
2203
- PaginationLink,
2204
- {
2205
- "aria-label": "Go to previous page",
2206
- size: "default",
2207
- className: cn("gap-1 px-2.5 sm:pl-2.5", className),
2208
- ...props,
2209
- children: [
2210
- /* @__PURE__ */ jsx42(ChevronLeft, {}),
2211
- /* @__PURE__ */ jsx42("span", { className: "hidden sm:block", children: "Previous" })
2212
- ]
2213
- }
2214
- );
2215
- }
2216
- function PaginationNext({
2217
- className,
2218
- ...props
2219
- }) {
2220
- return /* @__PURE__ */ jsxs25(
2221
- PaginationLink,
2222
- {
2223
- "aria-label": "Go to next page",
2224
- size: "default",
2225
- className: cn("gap-1 px-2.5 sm:pr-2.5", className),
2226
- ...props,
2227
- children: [
2228
- /* @__PURE__ */ jsx42("span", { className: "hidden sm:block", children: "Next" }),
2229
- /* @__PURE__ */ jsx42(ChevronRight, {})
2230
- ]
2231
- }
2232
- );
2233
- }
2234
- function PaginationEllipsis({
2235
- className,
2236
- ...props
2237
- }) {
2238
- return /* @__PURE__ */ jsxs25(
2239
- "span",
2240
- {
2241
- "aria-hidden": true,
2242
- "data-slot": "pagination-ellipsis",
2243
- className: cn("flex size-9 items-center justify-center", className),
2244
- ...props,
2245
- children: [
2246
- /* @__PURE__ */ jsx42(Ellipsis, { className: "size-4" }),
2247
- /* @__PURE__ */ jsx42("span", { className: "sr-only", children: "More pages" })
2248
- ]
2249
- }
2250
- );
2251
- }
2252
-
2253
- // src/components/DataDisplay/Pagination/Pagination.tsx
2254
- import { jsx as jsx43, jsxs as jsxs26 } from "react/jsx-runtime";
2255
- var CustomPagination = ({
2256
- totalPages,
2257
- currentPage,
2258
- onPageChange,
2259
- maxVisiblePages = 5
2260
- }) => {
2261
- const getPageNumbers = () => {
2262
- const pages = [];
2263
- if (totalPages <= maxVisiblePages) {
2264
- return Array.from({ length: totalPages }, (_, i) => i + 1);
2265
- }
2266
- const leftSiblingIndex = Math.max(currentPage - 1, 1);
2267
- const rightSiblingIndex = Math.min(currentPage + 1, totalPages);
2268
- const shouldShowLeftDots = leftSiblingIndex > 2;
2269
- const shouldShowRightDots = rightSiblingIndex < totalPages - 1;
2270
- if (!shouldShowLeftDots && shouldShowRightDots) {
2271
- const leftRange = Array.from({ length: 3 }, (_, i) => i + 1);
2272
- return [...leftRange, "...", totalPages];
2273
- }
2274
- if (shouldShowLeftDots && !shouldShowRightDots) {
2275
- const rightRange = Array.from(
2276
- { length: 3 },
2277
- (_, i) => totalPages - 2 + i
2278
- );
2279
- return [1, "...", ...rightRange];
2280
- }
2281
- if (shouldShowLeftDots && shouldShowRightDots) {
2282
- const middleRange = Array.from(
2283
- { length: 3 },
2284
- (_, i) => leftSiblingIndex + i
2285
- );
2286
- return [1, "...", ...middleRange, "...", totalPages];
2287
- }
2288
- return pages;
2289
- };
2290
- const handlePageChange = (page) => {
2291
- if (page >= 1 && page <= totalPages && page !== currentPage) {
2292
- onPageChange(page);
2293
- }
2294
- };
2295
- const pageNumbers = getPageNumbers();
2296
- return /* @__PURE__ */ jsx43(Pagination, { children: /* @__PURE__ */ jsxs26(PaginationContent, { children: [
2297
- /* @__PURE__ */ jsx43(PaginationItem, { children: /* @__PURE__ */ jsx43(
2298
- PaginationPrevious,
2299
- {
2300
- onClick: () => handlePageChange(currentPage - 1),
2301
- className: currentPage === 1 ? "pointer-events-none opacity-50" : "cursor-pointer"
2302
- }
2303
- ) }),
2304
- pageNumbers.map((pageNumber, index) => /* @__PURE__ */ jsx43(PaginationItem, { children: pageNumber === "..." ? /* @__PURE__ */ jsx43(PaginationEllipsis, {}) : /* @__PURE__ */ jsx43(
2305
- PaginationLink,
2306
- {
2307
- onClick: () => handlePageChange(pageNumber),
2308
- isActive: currentPage === pageNumber,
2309
- className: "cursor-pointer",
2310
- children: pageNumber
2311
- }
2312
- ) }, index)),
2313
- /* @__PURE__ */ jsx43(PaginationItem, { children: /* @__PURE__ */ jsx43(
2314
- PaginationNext,
2315
- {
2316
- onClick: () => handlePageChange(currentPage + 1),
2317
- className: currentPage === totalPages ? "pointer-events-none opacity-50" : "cursor-pointer"
2318
- }
2319
- ) })
2320
- ] }) });
2321
- };
2322
- var Pagination_default = CustomPagination;
2323
-
2324
- // src/components/DataDisplay/Table/Table.tsx
2325
- import { useState as useState18 } from "react";
2326
- import { jsx as jsx44, jsxs as jsxs27 } from "react/jsx-runtime";
2327
- var Table2 = ({
2328
- columns,
2329
- data,
2330
- rowActions,
2331
- className,
2332
- style,
2333
- pagination = false,
2334
- itemsPerPage = 10,
2335
- onPageChange,
2336
- loading = false,
2337
- ...props
2338
- }) => {
2339
- const rawColumns = Array.isArray(columns) ? columns : [];
2340
- const rawData = Array.isArray(data) ? data : [];
2341
- const rawRowActions = Array.isArray(rowActions) ? rowActions : [];
2342
- const [currentPage, setCurrentPage] = useState18(1);
2343
- const enablePagination = pagination && rawData.length > itemsPerPage;
2344
- const handlePageChange = (page) => {
2345
- setCurrentPage(page);
2346
- onPageChange?.(page);
2347
- };
2348
- const paginatedData = enablePagination ? rawData.slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage) : rawData;
2349
- return /* @__PURE__ */ jsxs27("div", { className: `${className} space-y-3`, style, children: [
2350
- /* @__PURE__ */ jsx44(
2351
- DataTable,
2352
- {
2353
- ...props,
2354
- columns: rawColumns,
2355
- data: paginatedData,
2356
- rowActions: rawRowActions,
2357
- loading
2358
- }
2359
- ),
2360
- enablePagination && /* @__PURE__ */ jsx44(
2361
- Pagination_default,
2362
- {
2363
- totalPages: Math.ceil(rawData.length / itemsPerPage),
2364
- currentPage,
2365
- onPageChange: handlePageChange
2366
- }
2367
- )
2368
- ] });
2369
- };
2370
- var Table_default = Table2;
2371
-
2372
- // src/components/Navigation/Tabs/Tabs.tsx
2373
- import { jsx as jsx45, jsxs as jsxs28 } from "react/jsx-runtime";
2374
- var Tabs = ({ className, style, tabs, verticalMenu, LinkComponent, pathname, canvasMode }) => {
2375
- const rawTabs = Array.isArray(tabs) ? tabs : [];
2376
- const baseClasses = "text-[12px] text-foreground p-2 text-center rounded-md transition-colors";
2377
- const activeClasses = "bg-white/10 text-white";
2378
- const hoverClasses = "hover:bg-white/5";
2379
- const isActive = (path) => {
2380
- if (!path) return false;
2381
- return pathname === path || path !== "/" && pathname?.startsWith(path);
2382
- };
2383
- const renderDesktopTab = (tab, index) => {
2384
- const finalClasses = [baseClasses, isActive(tab.url) ? activeClasses : hoverClasses, tab.className || ""].join(" ");
2385
- if (Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown) {
2386
- return /* @__PURE__ */ jsxs28(DropdownMenu, { children: [
2387
- /* @__PURE__ */ jsxs28(DropdownMenuTrigger, { className: `${finalClasses} inline-flex items-center gap-1`, children: [
2388
- tab.header,
2389
- /* @__PURE__ */ jsx45(ChevronDown, { className: "h-4 w-4 opacity-80" })
2390
- ] }),
2391
- /* @__PURE__ */ jsx45(
2392
- DropdownMenuContent,
2393
- {
2394
- align: "start",
2395
- sideOffset: 6,
2396
- className: "z-50 min-w-[160px] rounded-md border border-gray-200 bg-white p-1 shadow-lg",
2397
- children: tab.children.map((item) => /* @__PURE__ */ jsx45(
2398
- DropdownMenuItem,
2399
- {
2400
- asChild: true,
2401
- className: "cursor-pointer rounded-sm px-3 py-2 text-[12px] text-gray-800 hover:bg-gray-100 focus:bg-gray-100",
2402
- children: LinkComponent ? /* @__PURE__ */ jsx45(LinkComponent, { href: item.url || "#", children: item.header }) : item.header
2403
- },
2404
- item.id
2405
- ))
2406
- }
2407
- )
2408
- ] }, index);
2409
- }
2410
- return tab.url && LinkComponent ? /* @__PURE__ */ jsx45(LinkComponent, { href: tab.url, className: finalClasses, style: tab.style, children: tab.header }, index) : /* @__PURE__ */ jsx45("div", { className: finalClasses, style: tab.style, role: "button", tabIndex: 0, children: tab.header }, index);
2411
- };
2412
- const renderMobileMenu = () => /* @__PURE__ */ jsxs28(DropdownMenu, { children: [
2413
- /* @__PURE__ */ jsxs28(DropdownMenuTrigger, { className: "flex items-center gap-2 px-3 py-2 rounded-md bg-white/10 text-white text-sm", children: [
2414
- /* @__PURE__ */ jsx45(Menu, { className: "h-4 w-4" }),
2415
- "Menu"
2416
- ] }),
2417
- /* @__PURE__ */ jsx45(
2418
- DropdownMenuContent,
2419
- {
2420
- align: "start",
2421
- sideOffset: 6,
2422
- className: "z-50 w-56 rounded-md border border-gray-200 bg-white p-1 shadow-lg",
2423
- children: rawTabs.map((tab, i) => {
2424
- const hasChildren = Array.isArray(tab.children) && tab.children.length > 0 && tab.isDropDown;
2425
- if (hasChildren) {
2426
- return /* @__PURE__ */ jsxs28(DropdownMenuSub, { children: [
2427
- /* @__PURE__ */ jsx45(DropdownMenuSubTrigger, { className: "flex items-center justify-between cursor-pointer rounded-sm px-3 py-2 text-[13px] text-foreground hover:text-foreground", children: tab.header }),
2428
- /* @__PURE__ */ jsx45(DropdownMenuSubContent, { className: "bg-white border shadow-lg rounded-md p-1", children: tab.children.map((item) => /* @__PURE__ */ jsx45(
2429
- DropdownMenuItem,
2430
- {
2431
- asChild: true,
2432
- className: "cursor-pointer rounded-sm px-3 py-2 text-[12px] text-gray-800 hover:bg-gray-100",
2433
- children: LinkComponent && item.url ? /* @__PURE__ */ jsx45(LinkComponent, { href: item.url || "#", children: item.header }) : item.header
2434
- },
2435
- item.id
2436
- )) })
2437
- ] }, i);
2438
- }
2439
- return /* @__PURE__ */ jsx45(
2440
- DropdownMenuItem,
2441
- {
2442
- asChild: true,
2443
- className: "cursor-pointer rounded-sm px-3 py-2 text-[13px] text-gray-800 hover:bg-gray-100",
2444
- children: LinkComponent && tab.url ? /* @__PURE__ */ jsx45(LinkComponent, { href: tab.url || "#", children: tab.header }) : tab.header
2445
- },
2446
- i
2447
- );
2448
- })
2449
- }
2450
- )
2451
- ] });
2452
- const forceMobile = canvasMode === "mobile" || canvasMode === "tablet";
2453
- const forceDesktop = canvasMode === "desktop";
2454
- return /* @__PURE__ */ jsxs28("div", { className, style, children: [
2455
- forceDesktop && /* @__PURE__ */ jsx45("div", { className: "hidden md:flex", children: /* @__PURE__ */ jsx45("div", { className: `flex gap-2 ${verticalMenu ? "flex-col items-start" : "flex-row"}`, children: rawTabs.map(renderDesktopTab) }) }),
2456
- forceMobile && /* @__PURE__ */ jsx45("div", { children: renderMobileMenu() }),
2457
- /* @__PURE__ */ jsx45("div", { className: "md:hidden", children: renderMobileMenu() })
2458
- ] });
2459
- };
2460
- var Tabs_default = Tabs;
2461
-
2462
- // src/components/Navigation/Stages/Stages.tsx
2463
- import React15 from "react";
2464
- import { jsx as jsx46, jsxs as jsxs29 } from "react/jsx-runtime";
2465
- var StagesComponent = ({ stages, isShowBtn, buttonText, className, style }) => {
2466
- return /* @__PURE__ */ jsx46("div", { className, style, children: /* @__PURE__ */ jsxs29("div", { className: "flex items-center justify-between bg-gray-50 p-2 rounded-lg border border-gray-200 w-full", children: [
2467
- /* @__PURE__ */ jsx46("div", { className: "flex items-center", children: /* @__PURE__ */ jsx46("button", { className: "p-2 hover:bg-gray-100 rounded", children: /* @__PURE__ */ jsx46("svg", { className: "w-4 h-4 text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx46("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) }) }) }),
2468
- /* @__PURE__ */ jsx46("div", { className: "flex items-center flex-1 px-2", children: stages?.length > 0 && stages?.map((stage, index) => /* @__PURE__ */ jsxs29(React15.Fragment, { children: [
2469
- /* @__PURE__ */ jsx46(
2470
- "button",
2471
- {
2472
- className: `
2473
- min-w-[120px] px-4 py-2 rounded-full text-sm font-medium transition-colors duration-200 whitespace-nowrap ${stage.isActive ? "bg-[#034486] text-white shadow-md" : "bg-white text-gray-700 hover:bg-gray-100 border border-gray-200"}`,
2474
- children: stage.header
2475
- }
2476
- ),
2477
- index < stages.length - 1 && /* @__PURE__ */ jsx46("div", { className: "flex-shrink-0 w-3 h-px bg-gray-300" })
2478
- ] }, stage.id)) }),
2479
- isShowBtn && /* @__PURE__ */ jsx46("div", { className: "flex items-center", children: /* @__PURE__ */ jsx46("button", { className: "bg-[#034486] text-white px-6 py-2 rounded-lg text-sm font-medium transition-colors duration-200 shadow-sm", children: buttonText }) })
2480
- ] }) });
2481
- };
2482
- var Stages_default = StagesComponent;
2483
-
2484
- // src/components/Navigation/Spacer/Spacer.tsx
2485
- import { jsx as jsx47 } from "react/jsx-runtime";
2486
- var Spacer = ({ className, style }) => {
2487
- return /* @__PURE__ */ jsx47("div", { className: `${className}`, style });
2488
- };
2489
- var Spacer_default = Spacer;
2490
-
2491
- // src/components/Navigation/Profile/Profile.tsx
2492
- import { jsx as jsx48, jsxs as jsxs30 } from "react/jsx-runtime";
2493
-
2494
- // src/components/Navigation/Notification/Notification.tsx
2495
- import { jsx as jsx49, jsxs as jsxs31 } from "react/jsx-runtime";
2496
-
2497
- // src/components/Navigation/Logo/Logo.tsx
2498
- import { jsx as jsx50 } from "react/jsx-runtime";
2499
-
2500
- // src/components/ui/avatar.tsx
2501
- import * as React16 from "react";
2502
- import * as AvatarPrimitive from "@radix-ui/react-avatar";
2503
- import { jsx as jsx51 } from "react/jsx-runtime";
2504
- var Avatar = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx51(
2505
- AvatarPrimitive.Root,
2506
- {
2507
- ref,
2508
- className: cn(
2509
- "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
2510
- className
2511
- ),
2512
- ...props
2513
- }
2514
- ));
2515
- Avatar.displayName = AvatarPrimitive.Root.displayName;
2516
- var AvatarImage = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx51(
2517
- AvatarPrimitive.Image,
2518
- {
2519
- ref,
2520
- className: cn("aspect-square h-full w-full", className),
2521
- ...props
2522
- }
2523
- ));
2524
- AvatarImage.displayName = AvatarPrimitive.Image.displayName;
2525
- var AvatarFallback = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx51(
2526
- AvatarPrimitive.Fallback,
2527
- {
2528
- ref,
2529
- className: cn(
2530
- "flex h-full w-full items-center justify-center rounded-full bg-muted",
2531
- className
2532
- ),
2533
- ...props
2534
- }
2535
- ));
2536
- AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
2537
-
2538
- // src/components/Navigation/Navbar/Navbar.tsx
2539
- import { Fragment as Fragment17, jsx as jsx52, jsxs as jsxs32 } from "react/jsx-runtime";
2540
- function Navbar({
2541
- style,
2542
- badgeType,
2543
- badgeCount = 0,
2544
- hideBadgeWhenZero,
2545
- profileType,
2546
- showName,
2547
- imageUrl,
2548
- altText = "Logo",
2549
- canvasMode = "desktop",
2550
- LinkComponent,
2551
- ImageComponent,
2552
- list = [],
2553
- userName = "Guest User"
2554
- }) {
2555
- const isMobileView = canvasMode === "mobile" || canvasMode === "tablet";
2556
- return /* @__PURE__ */ jsx52("nav", { className: "w-full border-b bg-white shadow-sm", style, children: /* @__PURE__ */ jsxs32("div", { className: "mx-auto flex max-w-7xl items-center justify-between px-4 py-2", children: [
2557
- LinkComponent && ImageComponent ? /* @__PURE__ */ jsx52(LinkComponent, { href: "/", className: "flex items-center space-x-2", children: imageUrl ? /* @__PURE__ */ jsx52(ImageComponent, { src: imageUrl, alt: altText, width: 200, height: 200 }) : /* @__PURE__ */ jsx52("span", { className: "font-semibold text-blue-700", children: "Logo" }) }) : /* @__PURE__ */ jsx52("span", { className: "font-semibold text-blue-700", children: "Logo" }),
2558
- !isMobileView && LinkComponent && /* @__PURE__ */ jsx52("div", { className: "flex items-center space-x-6 sm:hidden md:flex", children: list.map((item) => /* @__PURE__ */ jsx52(
2559
- LinkComponent,
2560
- {
2561
- href: item.url || "#",
2562
- className: "text-sm font-medium text-gray-600 hover:text-gray-900 transition-colors",
2563
- children: item.header
2564
- },
2565
- item.id
2566
- )) }),
2567
- /* @__PURE__ */ jsxs32("div", { className: "flex items-center space-x-3", children: [
2568
- !isMobileView ? /* @__PURE__ */ jsx52("div", { className: "flex-1 px-6", children: /* @__PURE__ */ jsxs32("div", { className: "relative w-full max-w-md border border-gray-300 rounded-md", children: [
2569
- /* @__PURE__ */ jsx52(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" }),
2570
- /* @__PURE__ */ jsx52(Input, { placeholder: "Search", className: "pl-9 text-gray-400" })
2571
- ] }) }) : /* @__PURE__ */ jsx52(
2572
- Button,
2573
- {
2574
- variant: "ghost",
2575
- size: "icon",
2576
- className: "border border-gray-400",
2577
- children: /* @__PURE__ */ jsx52(Search, { className: "h-5 w-5 text-gray-400" })
2578
- }
2579
- ),
2580
- /* @__PURE__ */ jsxs32("div", { className: "relative bg-[#E9E9E9] rounded-md", children: [
2581
- /* @__PURE__ */ jsx52(Button, { variant: "ghost", size: "icon", children: /* @__PURE__ */ jsx52(Bell, { className: "h-5 w-5 text-[#1C1B1F]" }) }),
2582
- badgeType === "number" && !(hideBadgeWhenZero && badgeCount === 0) && badgeCount > 0 ? /* @__PURE__ */ jsx52("span", { className: "absolute -top-1 -right-1 flex h-4 w-4 items-center justify-center rounded-full bg-red-500 text-[10px] text-white leading-8", children: badgeCount }) : /* @__PURE__ */ jsx52("span", { className: "absolute -top-1 -right-1 flex h-2 w-2 items-center justify-center rounded-full bg-red-500" })
2583
- ] }),
2584
- /* @__PURE__ */ jsxs32(DropdownMenu, { children: [
2585
- /* @__PURE__ */ jsx52(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs32("div", { className: "flex items-center space-x-2", children: [
2586
- !isMobileView && showName && /* @__PURE__ */ jsx52("h4", { className: "text-[#000000] text-[13px] font-[500] mb-0", children: userName }),
2587
- !isMobileView ? /* @__PURE__ */ jsxs32(Fragment17, { children: [
2588
- /* @__PURE__ */ jsx52(Avatar, { className: "cursor-pointer h-8 w-8 text-gray-900", children: profileType === "avatar" ? /* @__PURE__ */ jsx52(
2589
- AvatarImage,
2590
- {
2591
- src: "/images/appbuilder/toolset/profile.svg",
2592
- alt: "Profile"
2593
- }
2594
- ) : /* @__PURE__ */ jsx52("div", { className: "w-8 h-8 bg-[#12715b] rounded-full text-[#fff] text-center text-[11px] flex items-center justify-center", children: userName && getInitials(userName) }) }),
2595
- /* @__PURE__ */ jsx52(
2596
- Button,
2597
- {
2598
- variant: "ghost",
2599
- size: "icon",
2600
- className: "text-gray-900 md:hidden",
2601
- children: /* @__PURE__ */ jsx52(Menu, { className: "h-6 w-6" })
2602
- }
2603
- )
2604
- ] }) : /* @__PURE__ */ jsx52(
2605
- Button,
2606
- {
2607
- variant: "ghost",
2608
- size: "icon",
2609
- className: "text-gray-900",
2610
- children: /* @__PURE__ */ jsx52(Menu, { className: "h-6 w-6" })
2611
- }
2612
- )
2613
- ] }) }),
2614
- /* @__PURE__ */ jsxs32(DropdownMenuContent, { align: "end", className: "bg-white", children: [
2615
- /* @__PURE__ */ jsx52(DropdownMenuLabel, { className: "text-black", children: "My Account" }),
2616
- /* @__PURE__ */ jsx52(DropdownMenuSeparator, {}),
2617
- LinkComponent && /* @__PURE__ */ jsxs32(Fragment17, { children: [
2618
- /* @__PURE__ */ jsx52(DropdownMenuItem, { className: "text-black", children: /* @__PURE__ */ jsx52(LinkComponent, { href: "/profile", children: "Profile" }) }),
2619
- /* @__PURE__ */ jsx52(DropdownMenuItem, { className: "text-black", children: /* @__PURE__ */ jsx52(LinkComponent, { href: "/settings", children: "Settings" }) }),
2620
- /* @__PURE__ */ jsx52(DropdownMenuItem, { className: "text-black", children: /* @__PURE__ */ jsx52(LinkComponent, { href: "/logout", children: "Logout" }) }),
2621
- list && list.length > 0 && /* @__PURE__ */ jsxs32(Fragment17, { children: [
2622
- /* @__PURE__ */ jsx52("div", { className: "w-full bg-[#656565] opacity-30 h-[1px] my-2" }),
2623
- /* @__PURE__ */ jsx52(DropdownMenuLabel, { className: "text-black", children: "Main Menu" }),
2624
- list.map((item) => /* @__PURE__ */ jsx52(DropdownMenuItem, { className: "text-black", children: /* @__PURE__ */ jsx52(LinkComponent, { href: item.url || "#", children: item.header }) }, item.id))
2625
- ] })
2626
- ] })
2627
- ] })
2628
- ] })
2629
- ] })
2630
- ] }) });
2631
- }
2632
-
2633
- // src/components/Chart/BarChart.tsx
2634
- import { BarChart, Bar, Area, AreaChart, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, Legend } from "recharts";
2635
- import { jsx as jsx53, jsxs as jsxs33 } from "react/jsx-runtime";
2636
- var ChartComponent = ({ className, style, ...props }) => {
2637
- const data = Array.isArray(props?.data) ? props.data : [];
2638
- const chartType = props.chartType || "bar";
2639
- const legendsPosition = props.legendsPosition === "middle" || props.legendsPosition === "bottom" ? props.legendsPosition : "top";
2640
- return /* @__PURE__ */ jsx53("div", { className: `${className} h-[400px]`, style, children: data.length > 0 && /* @__PURE__ */ jsx53(ResponsiveContainer, { width: "100%", height: "100%", children: chartType === "bar" ? /* @__PURE__ */ jsxs33(BarChart, { data, children: [
2641
- /* @__PURE__ */ jsx53(CartesianGrid, { strokeDasharray: "3 3" }),
2642
- /* @__PURE__ */ jsx53(XAxis, { dataKey: "name" }),
2643
- /* @__PURE__ */ jsx53(YAxis, {}),
2644
- /* @__PURE__ */ jsx53(Tooltip, {}),
2645
- /* @__PURE__ */ jsx53(Legend, { verticalAlign: legendsPosition, align: "center" }),
2646
- /* @__PURE__ */ jsx53(Bar, { dataKey: "value", fill: "#00695C" })
2647
- ] }) : /* @__PURE__ */ jsxs33(AreaChart, { data, children: [
2648
- /* @__PURE__ */ jsx53("defs", { children: /* @__PURE__ */ jsxs33("linearGradient", { id: "colorCount", x1: "0", y1: "0", x2: "0", y2: "1", children: [
2649
- /* @__PURE__ */ jsx53("stop", { offset: "5%", stopColor: "#00695C", stopOpacity: 0.8 }),
2650
- /* @__PURE__ */ jsx53("stop", { offset: "95%", stopColor: "#00695C", stopOpacity: 0 })
2651
- ] }) }),
2652
- /* @__PURE__ */ jsx53(CartesianGrid, { strokeDasharray: "3 3" }),
2653
- /* @__PURE__ */ jsx53(XAxis, { dataKey: "name" }),
2654
- /* @__PURE__ */ jsx53(YAxis, {}),
2655
- /* @__PURE__ */ jsx53(Tooltip, {}),
2656
- /* @__PURE__ */ jsx53(
2657
- Area,
2658
- {
2659
- type: "monotone",
2660
- dataKey: "value",
2661
- stroke: "#00695C",
2662
- fillOpacity: 1,
2663
- fill: "url(#colorCount)"
2664
- }
2665
- )
2666
- ] }) }) });
2667
- };
2668
- var BarChart_default = ChartComponent;
2669
-
2670
- // src/components/Chart/PieChart.tsx
2671
- import { PieChart, Pie, Cell, ResponsiveContainer as ResponsiveContainer2, Tooltip as Tooltip2, LabelList } from "recharts";
2672
- import { Fragment as Fragment18, jsx as jsx54, jsxs as jsxs34 } from "react/jsx-runtime";
2673
- var DonutChart = ({ className, style, ...props }) => {
2674
- const data = Array.isArray(props?.data) ? props.data : [];
2675
- const total = data.reduce((sum, d) => sum + d.value, 0);
2676
- const showPercentage = props.showPercentage ?? true;
2677
- const showLegends = props.showLegends ?? true;
2678
- const labelType = props.labelType || "inside";
2679
- const canvasMode = props.canvasMode;
2680
- const renderLabel = ({ value, x, y }) => {
2681
- if (value == null) return null;
2682
- const percentage = (Number(value) / total * 100).toFixed(0);
2683
- return /* @__PURE__ */ jsxs34(
2684
- "text",
2685
- {
2686
- x,
2687
- y,
2688
- textAnchor: "middle",
2689
- dominantBaseline: "central",
2690
- className: "text-[10px] font-semibold",
2691
- fill: labelType === "inside" ? "#fff" : "#000",
2692
- children: [
2693
- value,
2694
- "k ",
2695
- showPercentage ? `(${percentage}%)` : ""
2696
- ]
2697
- }
2698
- );
2699
- };
2700
- const forceMobile = canvasMode === "mobile" || canvasMode === "tablet";
2701
- const forceDesktop = canvasMode === "desktop";
2702
- const wrapperClass = canvasMode ? forceDesktop ? "flex-row" : "flex-col" : "flex-col md:flex-row";
2703
- const renderLegends = () => {
2704
- if (!showLegends) return null;
2705
- return /* @__PURE__ */ jsx54(Fragment18, { children: data.map((d) => /* @__PURE__ */ jsxs34(
2706
- "div",
2707
- {
2708
- className: "flex items-center space-x-2 rounded-md border border-gray-200 px-3 py-2 w-[48%] md:w-auto",
2709
- children: [
2710
- /* @__PURE__ */ jsx54(
2711
- "span",
2712
- {
2713
- className: "inline-block w-[16px] h-[16px] rounded",
2714
- style: { backgroundColor: d.color }
2715
- }
2716
- ),
2717
- /* @__PURE__ */ jsx54("span", { className: "text-[#000000] text-[12px] md:text-[13px] font-[500]", children: d.name })
2718
- ]
2719
- },
2720
- d.name
2721
- )) });
2722
- };
2723
- return /* @__PURE__ */ jsxs34(
2724
- "div",
2725
- {
2726
- className: `relative flex items-center ${wrapperClass} ${className}`,
2727
- style,
2728
- children: [
2729
- /* @__PURE__ */ jsxs34("div", { className: "relative w-full md:w-[70%] h-[300px] md:h-[400px] flex items-center justify-center", children: [
2730
- data.length > 0 && /* @__PURE__ */ jsx54(ResponsiveContainer2, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxs34(PieChart, { children: [
2731
- /* @__PURE__ */ jsxs34(
2732
- Pie,
2733
- {
2734
- data,
2735
- cx: "50%",
2736
- cy: "50%",
2737
- innerRadius: 70,
2738
- outerRadius: 120,
2739
- dataKey: "value",
2740
- labelLine: false,
2741
- isAnimationActive: false,
2742
- children: [
2743
- data.map((entry, index) => /* @__PURE__ */ jsx54(Cell, { fill: entry.color }, `cell-${index}`)),
2744
- /* @__PURE__ */ jsx54(
2745
- LabelList,
2746
- {
2747
- dataKey: "value",
2748
- position: labelType === "inside" ? "inside" : "outside",
2749
- content: renderLabel
2750
- }
2751
- )
2752
- ]
2753
- }
2754
- ),
2755
- /* @__PURE__ */ jsx54(Tooltip2, { formatter: (value, name) => [`${value}k`, name] })
2756
- ] }) }),
2757
- /* @__PURE__ */ jsxs34("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 text-2xl md:text-4xl font-bold text-[#000]", children: [
2758
- total,
2759
- "k"
2760
- ] })
2761
- ] }),
2762
- /* @__PURE__ */ jsx54("div", { className: `flex ${forceDesktop ? "flex-col ml-auto space-y-3" : "flex-wrap justify-center gap-2 mt-4"}
2763
- w-full md:w-auto`, children: renderLegends() })
2764
- ]
2765
- }
2766
- );
2767
- };
2768
- var PieChart_default = DonutChart;
2769
-
2770
- // src/components/Blocks/EmailComposer.tsx
2771
- import { jsx as jsx55, jsxs as jsxs35 } from "react/jsx-runtime";
2772
- function EmailComposer({ className, style, to, setTo, showCc, setShowCc, showBcc, setShowBcc, cc, setCc, bcc, setBcc, subject, setSubject, body, setBody }) {
2773
- return /* @__PURE__ */ jsx55("div", { className, style, children: /* @__PURE__ */ jsxs35("div", { className: "border rounded-md shadow bg-[#fff] p-4 mx-auto z-[50] relative", children: [
2774
- /* @__PURE__ */ jsx55("div", { className: "mb-3", children: /* @__PURE__ */ jsx55(
2775
- "input",
2776
- {
2777
- type: "email",
2778
- placeholder: "From",
2779
- className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]",
2780
- required: true
2781
- }
2782
- ) }),
2783
- /* @__PURE__ */ jsx55("div", { className: "mb-3", children: /* @__PURE__ */ jsxs35("div", { className: "flex items-center gap-2", children: [
2784
- /* @__PURE__ */ jsx55(
2785
- "input",
2786
- {
2787
- type: "email",
2788
- value: to,
2789
- onChange: (e) => setTo?.(e.target.value),
2790
- placeholder: "To",
2791
- className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]",
2792
- required: true
2793
- }
2794
- ),
2795
- !showCc && /* @__PURE__ */ jsx55(
2796
- "button",
2797
- {
2798
- onClick: () => setShowCc?.(true),
2799
- className: "px-3 py-1 border rounded-md text-sm hover:bg-gray-100 bg-[#E9E9E9] text-[#383838]",
2800
- children: "Cc"
2801
- }
2802
- ),
2803
- !showBcc && /* @__PURE__ */ jsx55(
2804
- "button",
2805
- {
2806
- onClick: () => setShowBcc?.(true),
2807
- className: "px-3 py-1 border rounded-md text-sm hover:bg-gray-100 bg-[#E9E9E9] text-[#383838]",
2808
- children: "Bcc"
2809
- }
2810
- )
2811
- ] }) }),
2812
- showCc && /* @__PURE__ */ jsx55("div", { className: "mb-3", children: /* @__PURE__ */ jsx55(
2813
- "input",
2814
- {
2815
- type: "text",
2816
- value: cc,
2817
- onChange: (e) => setCc?.(e.target.value),
2818
- placeholder: "Cc",
2819
- className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
2820
- }
2821
- ) }),
2822
- showBcc && /* @__PURE__ */ jsx55("div", { className: "mb-3", children: /* @__PURE__ */ jsx55(
2823
- "input",
2824
- {
2825
- type: "text",
2826
- value: bcc,
2827
- onChange: (e) => setBcc?.(e.target.value),
2828
- placeholder: "Bcc",
2829
- className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
2830
- }
2831
- ) }),
2832
- /* @__PURE__ */ jsx55("div", { className: "mb-3", children: /* @__PURE__ */ jsx55(
2833
- "input",
2834
- {
2835
- type: "text",
2836
- value: subject,
2837
- onChange: (e) => setSubject?.(e.target.value),
2838
- placeholder: "Subject",
2839
- className: "w-full flex-1 border-2 rounded-md h-[40px] px-3 focus:outline-none border-[#E9E9E9] text-[#383838]"
2840
- }
2841
- ) }),
2842
- /* @__PURE__ */ jsx55("div", { className: "mb-4", children: /* @__PURE__ */ jsx55(MyEditor, { value: body, onChange: setBody }) }),
2843
- /* @__PURE__ */ jsxs35("div", { className: "flex justify-end gap-2", children: [
2844
- /* @__PURE__ */ jsx55("button", { className: "px-4 py-2 rounded-md text-gray-600 hover:bg-gray-100", children: "Discard" }),
2845
- /* @__PURE__ */ jsx55("button", { className: "px-4 py-2 rounded-md border text-[#12715B] border-[#12715B]", children: "Reset" }),
2846
- /* @__PURE__ */ jsx55("button", { className: "px-4 py-2 rounded-md bg-[#12715B] text-white", children: "Send" })
2847
- ] })
2848
- ] }) });
2849
- }
2850
-
2851
- // src/components/ui/sonner-toast.tsx
2852
- import { toast } from "sonner";
2853
- function showSonnerToast({
2854
- title,
2855
- description,
2856
- variant = "default",
2857
- duration = 3e3,
2858
- actionLabel,
2859
- onAction
2860
- }) {
2861
- const options = {
2862
- description,
2863
- duration,
2864
- action: actionLabel ? {
2865
- label: actionLabel,
2866
- onClick: onAction || (() => {
2867
- })
2868
- } : void 0
2869
- };
2870
- switch (variant) {
2871
- case "success":
2872
- toast.success(title, options);
2873
- break;
2874
- case "error":
2875
- toast.error(title, options);
2876
- break;
2877
- case "info":
2878
- toast.info(title, options);
2879
- break;
2880
- case "warning":
2881
- toast.warning(title, options);
2882
- break;
2883
- default:
2884
- toast(title, options);
2885
- }
2886
- }
2887
-
2888
- // src/components/StateManagment/StateContext.tsx
2889
- import { createContext, useContext, useReducer } from "react";
2890
-
2891
- // src/components/StateManagment/stateReducer.ts
2892
- function stateReducer(state, action) {
2893
- switch (action.type) {
2894
- case "SET_STATE":
2895
- return { ...state, [action.key]: action.value };
2896
- default:
2897
- return state;
2898
- }
2899
- }
2900
-
2901
- // src/components/StateManagment/StateContext.tsx
2902
- import { jsx as jsx56 } from "react/jsx-runtime";
2903
- var StateContext = createContext(null);
2904
- function StateProvider({ children }) {
2905
- const [state, dispatch] = useReducer(stateReducer, {});
2906
- return /* @__PURE__ */ jsx56(StateContext.Provider, { value: { state, dispatch }, children });
2907
- }
2908
- function useAppState() {
2909
- return useContext(StateContext);
2910
- }
2911
-
2912
- // src/components/Form/Form.tsx
2913
- import React18, { useMemo as useMemo2 } from "react";
2914
- import { zodResolver } from "@hookform/resolvers/zod";
2915
- import { useForm, Controller } from "react-hook-form";
2916
- import { z } from "zod";
2917
- import { jsx as jsx57 } from "react/jsx-runtime";
2918
- function generateZodSchema(data) {
2919
- const fields = data.reduce((acc, f) => {
2920
- const name = f.name || "unnamed";
2921
- const message = f.message || `${name} is invalid`;
2922
- const passwordLen = f.passwordLength;
2923
- let fieldSchema = z.string({ message });
2924
- switch (f.type) {
2925
- case "Text":
2926
- case "Search":
2927
- fieldSchema = z.string({ message });
2928
- if (f?.min && f?.min !== "") fieldSchema = fieldSchema.min(f.min);
2929
- else if (f.isRequired) fieldSchema = fieldSchema.min(1, { message: `${message}. Cannot be empty` });
2930
- if (f?.max && f?.max !== "") fieldSchema = fieldSchema.max(f.max);
2931
- if (f?.email) fieldSchema = fieldSchema.email();
2932
- if (f?.url) fieldSchema = fieldSchema.url();
2933
- if (f?.regex) fieldSchema = fieldSchema.regex(new RegExp(f.regex));
2934
- break;
2935
- case "Email":
2936
- fieldSchema = z.email({ message });
2937
- break;
2938
- case "Password":
2939
- fieldSchema = z.string({ message }).min(passwordLen, { message: `Password must be at least ${passwordLen} characters long` });
2940
- break;
2941
- case "Phone":
2942
- fieldSchema = z.string().transform((val) => val.replace(/\D/g, "")).transform((val) => val.slice(-10)).refine((val) => {
2943
- return val.length === 10;
2944
- }, {
2945
- message: "Phone number must be 10 digits long"
2946
- });
2947
- break;
2948
- case "DatePicker":
2949
- fieldSchema = z.iso.date({ message });
2950
- break;
2951
- case "FileInput":
2952
- fieldSchema = z.instanceof(File, { message: "Please select a file" });
2953
- if (f?.maxSize) {
2954
- fieldSchema = fieldSchema.refine(
2955
- (file) => file.size <= f.maxSize,
2956
- { message: `File size must be less than ${f.maxSize / 1024 / 1024}MB` }
2957
- );
2958
- }
2959
- if (f?.acceptedTypes) {
2960
- fieldSchema = fieldSchema.refine(
2961
- (file) => f.acceptedTypes.includes(file.type),
2962
- { message: `File type must be one of: ${f.acceptedTypes.join(", ")}` }
2963
- );
2964
- }
2965
- break;
2966
- case "Checkbox":
2967
- fieldSchema = z.boolean({ message });
2968
- break;
2969
- case "Dropdown":
2970
- fieldSchema = z.string({ message });
2971
- break;
2972
- case "NumberInput":
2973
- fieldSchema = z.number({ message });
2974
- if (f?.min !== void 0) fieldSchema = fieldSchema.min(f.min);
2975
- if (f?.max !== void 0) fieldSchema = fieldSchema.max(f.max);
2976
- break;
2977
- default:
2978
- fieldSchema = z.any();
2979
- }
2980
- if (!f.isRequired) fieldSchema = fieldSchema.optional();
2981
- acc[name] = fieldSchema;
2982
- return acc;
2983
- }, {});
2984
- return z.object(fields);
2985
- }
2986
- var Form = ({
2987
- validation,
2988
- defaultValues,
2989
- children,
2990
- onSubmit,
2991
- onReset
2992
- }) => {
2993
- const schema = useMemo2(() => {
2994
- if (!validation || validation.length === 0) return null;
2995
- return generateZodSchema(validation);
2996
- }, [validation]);
2997
- const {
2998
- handleSubmit,
2999
- control,
3000
- formState: { errors },
3001
- reset
3002
- } = useForm({
3003
- resolver: schema ? zodResolver(schema) : void 0,
3004
- defaultValues
3005
- });
3006
- const formSubmit = (data) => {
3007
- if (onSubmit) onSubmit(data);
3008
- };
3009
- const handleReset = () => {
3010
- reset();
3011
- if (onReset) onReset();
3012
- };
3013
- return /* @__PURE__ */ jsx57(
3014
- "form",
3015
- {
3016
- onSubmit: handleSubmit(formSubmit),
3017
- onReset: handleReset,
3018
- className: cn(
3019
- "space-y-4 min-h-[100px] h-auto flex justify-between flex-col"
3020
- ),
3021
- children: /* @__PURE__ */ jsx57("div", { className: "min-h-[50px]", children: React18.Children.map(children, (child) => {
3022
- const processChild = (child2) => {
3023
- if (React18.isValidElement(child2)) {
3024
- const node = child2.props?.node;
3025
- if (node?.category === "Form Controls") {
3026
- const name = node.properties?.name || "unnamed";
3027
- return /* @__PURE__ */ jsx57("div", { className: "flex flex-col", children: /* @__PURE__ */ jsx57(
3028
- Controller,
3029
- {
3030
- name,
3031
- control,
3032
- render: ({ field: controllerField }) => {
3033
- const childElement = child2;
3034
- return React18.cloneElement(childElement, {
3035
- input: {
3036
- ...controllerField,
3037
- value: controllerField.value || "",
3038
- hasFormContainer: true,
3039
- validateOnMount: true,
3040
- errorMessage: errors[name]?.message || null
3041
- },
3042
- children: void 0
3043
- });
3044
- }
3045
- }
3046
- ) }, node.id);
3047
- }
3048
- if (child2.props?.children) {
3049
- const childElement = child2;
3050
- return React18.cloneElement(childElement, {
3051
- children: React18.Children.map(childElement.props.children, processChild)
3052
- });
3053
- }
3054
- return React18.cloneElement(child2);
3055
- }
3056
- return child2;
3057
- };
3058
- return processChild(child);
3059
- }) })
3060
- }
3061
- );
3062
- };
3063
- var Form_default = Form;
3064
-
3065
- // src/components/Form/Wrapper.tsx
3066
- import { useMemo as useMemo3 } from "react";
3067
- import { zodResolver as zodResolver2 } from "@hookform/resolvers/zod";
3068
- import { useForm as useForm2 } from "react-hook-form";
3069
- import { z as z2 } from "zod";
3070
- import { jsx as jsx58 } from "react/jsx-runtime";
3071
- function generateZodSchema2(data) {
3072
- const fields = data.reduce((acc, f) => {
3073
- const name = f.name || "unnamed";
3074
- const message = f.message || `${name} is invalid`;
3075
- const passwordLen = f.passwordLength;
3076
- let fieldSchema = z2.string({ message });
3077
- switch (f.type) {
3078
- case "Text":
3079
- case "Search":
3080
- fieldSchema = z2.string({ message });
3081
- if (f?.min && f?.min !== "") fieldSchema = fieldSchema.min(f.min);
3082
- else if (f.isRequired) fieldSchema = fieldSchema.min(1, { message: `${message}. Cannot be empty` });
3083
- if (f?.max && f?.max !== "") fieldSchema = fieldSchema.max(f.max);
3084
- if (f?.email) fieldSchema = fieldSchema.email();
3085
- if (f?.url) fieldSchema = fieldSchema.url();
3086
- if (f?.regex) fieldSchema = fieldSchema.regex(new RegExp(f.regex));
3087
- break;
3088
- case "Email":
3089
- fieldSchema = z2.email({ message });
3090
- break;
3091
- case "Password":
3092
- fieldSchema = z2.string({ message }).min(passwordLen, { message: `Password must be at least ${passwordLen} characters long` });
3093
- break;
3094
- case "Phone":
3095
- fieldSchema = z2.string().transform((val) => val.replace(/\D/g, "")).transform((val) => val.slice(-10)).refine((val) => {
3096
- return val.length === 10;
3097
- }, {
3098
- message: "Phone number must be 10 digits long"
3099
- });
3100
- break;
3101
- case "DatePicker":
3102
- fieldSchema = z2.iso.date({ message });
3103
- break;
3104
- case "FileInput":
3105
- fieldSchema = z2.instanceof(File, { message: "Please select a file" });
3106
- if (f?.maxSize) {
3107
- fieldSchema = fieldSchema.refine(
3108
- (file) => file.size <= f.maxSize,
3109
- { message: `File size must be less than ${f.maxSize / 1024 / 1024}MB` }
3110
- );
3111
- }
3112
- if (f?.acceptedTypes) {
3113
- fieldSchema = fieldSchema.refine(
3114
- (file) => f.acceptedTypes.includes(file.type),
3115
- { message: `File type must be one of: ${f.acceptedTypes.join(", ")}` }
3116
- );
3117
- }
3118
- break;
3119
- case "Checkbox":
3120
- fieldSchema = z2.boolean({ message });
3121
- break;
3122
- case "Dropdown":
3123
- fieldSchema = z2.string({ message });
3124
- break;
3125
- case "NumberInput":
3126
- fieldSchema = z2.number({ message });
3127
- if (f?.min !== void 0) fieldSchema = fieldSchema.min(f.min);
3128
- if (f?.max !== void 0) fieldSchema = fieldSchema.max(f.max);
3129
- break;
3130
- default:
3131
- fieldSchema = z2.any();
3132
- }
3133
- if (!f.isRequired) fieldSchema = fieldSchema.optional();
3134
- acc[name] = fieldSchema;
3135
- return acc;
3136
- }, {});
3137
- return z2.object(fields);
3138
- }
3139
- var FormWrapper = ({
3140
- validation,
3141
- defaultValues,
3142
- children,
3143
- onSubmit,
3144
- onReset
3145
- }) => {
3146
- const schema = useMemo3(() => {
3147
- if (!validation || validation.length === 0) return null;
3148
- return generateZodSchema2(validation);
3149
- }, [validation]);
3150
- const form = useForm2({
3151
- resolver: schema ? zodResolver2(schema) : void 0,
3152
- defaultValues
3153
- });
3154
- const formSubmit = (data) => {
3155
- if (onSubmit) onSubmit(data);
3156
- };
3157
- const handleReset = () => {
3158
- form.reset();
3159
- if (onReset) onReset();
3160
- };
3161
- return /* @__PURE__ */ jsx58(
3162
- "form",
3163
- {
3164
- onSubmit: form.handleSubmit(formSubmit),
3165
- onReset: handleReset,
3166
- className: cn(
3167
- "space-y-4 min-h-[100px] h-auto flex justify-between flex-col"
3168
- ),
3169
- children: /* @__PURE__ */ jsx58("div", { className: "min-h-[50px]", children: typeof children === "function" ? children(form) : children })
3170
- }
3171
- );
3172
- };
3173
- var Wrapper_default = FormWrapper;
2
+ BarChart_default,
3
+ Breadcrumb_default,
4
+ Button_default,
5
+ Checkbox_default,
6
+ Container_default,
7
+ DatePicker,
8
+ DateRange_default,
9
+ Dropdown_default,
10
+ EmailComposer,
11
+ EmailInput_default,
12
+ FileInput_default,
13
+ Flex_default,
14
+ Form_default,
15
+ Grid_default,
16
+ Image_default,
17
+ Modal_default,
18
+ MultiCheckbox_default,
19
+ Navbar,
20
+ NumberInput_default,
21
+ Pagination_default,
22
+ PasswordInput_default,
23
+ PhoneInput_default,
24
+ PieChart_default,
25
+ RadioInput_default,
26
+ RichText,
27
+ SearchInput_default,
28
+ Shape_default,
29
+ Spacer_default,
30
+ SplitButton,
31
+ Stages_default,
32
+ StateProvider,
33
+ SwitchToggle_default,
34
+ Table_default,
35
+ Tabs_default,
36
+ TextInputGroup_default,
37
+ TextInput_default,
38
+ Textarea_default,
39
+ Typography_default,
40
+ UrlInput_default,
41
+ Wrapper_default,
42
+ cn,
43
+ getInitials,
44
+ showSonnerToast,
45
+ stateReducer,
46
+ useAppState
47
+ } from "./chunk-JFDQZCMW.mjs";
3174
48
  export {
3175
49
  BarChart_default as BarChart,
3176
50
  Breadcrumb_default as Breadcrumb,
@@ -3218,32 +92,4 @@ export {
3218
92
  stateReducer,
3219
93
  useAppState
3220
94
  };
3221
- /*! Bundled license information:
3222
-
3223
- lucide-react/dist/esm/shared/src/utils.js:
3224
- lucide-react/dist/esm/defaultAttributes.js:
3225
- lucide-react/dist/esm/Icon.js:
3226
- lucide-react/dist/esm/createLucideIcon.js:
3227
- lucide-react/dist/esm/icons/bell.js:
3228
- lucide-react/dist/esm/icons/calculator.js:
3229
- lucide-react/dist/esm/icons/calendar.js:
3230
- lucide-react/dist/esm/icons/check.js:
3231
- lucide-react/dist/esm/icons/chevron-down.js:
3232
- lucide-react/dist/esm/icons/chevron-left.js:
3233
- lucide-react/dist/esm/icons/chevron-right.js:
3234
- lucide-react/dist/esm/icons/chevron-up.js:
3235
- lucide-react/dist/esm/icons/circle.js:
3236
- lucide-react/dist/esm/icons/ellipsis.js:
3237
- lucide-react/dist/esm/icons/mail.js:
3238
- lucide-react/dist/esm/icons/menu.js:
3239
- lucide-react/dist/esm/icons/scan-eye.js:
3240
- lucide-react/dist/esm/icons/search.js:
3241
- lucide-react/dist/esm/lucide-react.js:
3242
- (**
3243
- * @license lucide-react v0.542.0 - ISC
3244
- *
3245
- * This source code is licensed under the ISC license.
3246
- * See the LICENSE file in the root directory of this source tree.
3247
- *)
3248
- */
3249
95
  //# sourceMappingURL=index.mjs.map