next-helios-fe 1.4.22 → 1.4.23
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/package.json
CHANGED
@@ -21,24 +21,29 @@ interface TableProps {
|
|
21
21
|
options?: {
|
22
22
|
toolbar?: {
|
23
23
|
addData?: {
|
24
|
-
show
|
25
|
-
onClick
|
24
|
+
show: boolean;
|
25
|
+
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
26
26
|
};
|
27
27
|
search?: {
|
28
|
-
show
|
28
|
+
show: boolean;
|
29
29
|
};
|
30
30
|
filter?: {
|
31
|
-
show
|
31
|
+
show: boolean;
|
32
32
|
};
|
33
33
|
export?: {
|
34
|
-
show
|
34
|
+
show: boolean;
|
35
35
|
};
|
36
36
|
columnSearch?: {
|
37
|
-
show
|
37
|
+
show: boolean;
|
38
38
|
};
|
39
39
|
pagination?: {
|
40
|
-
show
|
40
|
+
show: boolean;
|
41
41
|
};
|
42
|
+
customTool?: {
|
43
|
+
icon: string;
|
44
|
+
variant: "primary" | "secondary" | "success" | "warning" | "danger";
|
45
|
+
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
46
|
+
}[];
|
42
47
|
};
|
43
48
|
hideNumberColumn?: boolean;
|
44
49
|
border?: boolean;
|
@@ -443,10 +448,36 @@ export const Table: TableComponentProps = ({
|
|
443
448
|
>
|
444
449
|
{title && <span className="text-lg whitespace-nowrap">{title}</span>}
|
445
450
|
<div className="flex items-center gap-4">
|
451
|
+
{options?.toolbar?.customTool &&
|
452
|
+
options?.toolbar?.customTool?.length !== 0 &&
|
453
|
+
options?.toolbar?.customTool.map((item) => {
|
454
|
+
const variant =
|
455
|
+
item.variant === "secondary"
|
456
|
+
? "bg-secondary hover:bg-secondary-dark"
|
457
|
+
: item.variant === "success"
|
458
|
+
? "bg-success hover:bg-success-dark"
|
459
|
+
: item.variant === "warning"
|
460
|
+
? "bg-warning hover:bg-warning-dark"
|
461
|
+
: item.variant === "danger"
|
462
|
+
? "bg-danger hover:bg-danger-dark"
|
463
|
+
: "bg-primary hover:bg-primary-dark";
|
464
|
+
|
465
|
+
return (
|
466
|
+
<button
|
467
|
+
type="button"
|
468
|
+
className={`p-1.5 rounded-full text-white active:opacity-70 active:duration-300 active:ease-out ${variant}`}
|
469
|
+
onClick={(e) => {
|
470
|
+
item.onClick && item.onClick(e);
|
471
|
+
}}
|
472
|
+
>
|
473
|
+
<Icon icon={item.icon} className="text-2xl" />
|
474
|
+
</button>
|
475
|
+
);
|
476
|
+
})}
|
446
477
|
{options?.toolbar?.addData?.show !== false && (
|
447
478
|
<button
|
448
479
|
type="button"
|
449
|
-
className="p-1.5 rounded-full bg-primary text-white hover:bg-primary-dark"
|
480
|
+
className="p-1.5 rounded-full bg-primary text-white hover:bg-primary-dark active:opacity-70 active:duration-300 active:ease-out"
|
450
481
|
onClick={(e) => {
|
451
482
|
options?.toolbar?.addData?.onClick &&
|
452
483
|
options?.toolbar?.addData?.onClick(e);
|