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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "next-helios-fe",
3
- "version": "1.4.22",
3
+ "version": "1.4.23",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -21,24 +21,29 @@ interface TableProps {
21
21
  options?: {
22
22
  toolbar?: {
23
23
  addData?: {
24
- show?: boolean;
25
- onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
24
+ show: boolean;
25
+ onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
26
26
  };
27
27
  search?: {
28
- show?: boolean;
28
+ show: boolean;
29
29
  };
30
30
  filter?: {
31
- show?: boolean;
31
+ show: boolean;
32
32
  };
33
33
  export?: {
34
- show?: boolean;
34
+ show: boolean;
35
35
  };
36
36
  columnSearch?: {
37
- show?: boolean;
37
+ show: boolean;
38
38
  };
39
39
  pagination?: {
40
- show?: boolean;
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);