@gearbox-protocol/permissionless-ui 1.2.13 → 1.2.15
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.
|
@@ -28,6 +28,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
28
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
29
|
var table_exports = {};
|
|
30
30
|
__export(table_exports, {
|
|
31
|
+
SortingTableHead: () => SortingTableHead,
|
|
31
32
|
Table: () => Table,
|
|
32
33
|
TableBody: () => TableBody,
|
|
33
34
|
TableCaption: () => TableCaption,
|
|
@@ -39,8 +40,11 @@ __export(table_exports, {
|
|
|
39
40
|
});
|
|
40
41
|
module.exports = __toCommonJS(table_exports);
|
|
41
42
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
43
|
+
var import_lucide_react = require("lucide-react");
|
|
42
44
|
var React = __toESM(require("react"));
|
|
43
45
|
var import_utils = __toESM(require('../utils/index.js'));
|
|
46
|
+
var import_button = require('./buttons/button.js');
|
|
47
|
+
var import_tooltip = require('./tooltip.js');
|
|
44
48
|
const Table = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-xl border relative w-full overflow-auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
45
49
|
"table",
|
|
46
50
|
{
|
|
@@ -108,8 +112,61 @@ const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
108
112
|
}
|
|
109
113
|
));
|
|
110
114
|
TableCaption.displayName = "TableCaption";
|
|
115
|
+
const SortingTableHead = React.forwardRef(
|
|
116
|
+
({
|
|
117
|
+
title,
|
|
118
|
+
isSorted,
|
|
119
|
+
direction,
|
|
120
|
+
setSort,
|
|
121
|
+
placement = "right",
|
|
122
|
+
children,
|
|
123
|
+
className,
|
|
124
|
+
...props
|
|
125
|
+
}, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { ref, className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tooltip.Tooltip, { delayDuration: 200, children: [
|
|
126
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
127
|
+
"div",
|
|
128
|
+
{
|
|
129
|
+
className: (0, import_utils.default)(
|
|
130
|
+
"group flex items-center gap-1 w-fit cursor-pointer hover:text-white",
|
|
131
|
+
placement === "left" ? "flex-row-reverse" : "flex-row"
|
|
132
|
+
),
|
|
133
|
+
onClick: () => setSort(direction === "asc" ? "desc" : "asc"),
|
|
134
|
+
children: [
|
|
135
|
+
children,
|
|
136
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
137
|
+
import_button.Button,
|
|
138
|
+
{
|
|
139
|
+
variant: "ghost",
|
|
140
|
+
size: "sm",
|
|
141
|
+
className: (0, import_utils.default)(
|
|
142
|
+
"hover:bg-accent/0 group-hover:text-white p-0 h-auto",
|
|
143
|
+
isSorted ? void 0 : "opacity-0 group-hover:opacity-100"
|
|
144
|
+
),
|
|
145
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
146
|
+
import_lucide_react.ArrowDown,
|
|
147
|
+
{
|
|
148
|
+
className: (0, import_utils.default)(
|
|
149
|
+
`h-${4} w-${4}`,
|
|
150
|
+
direction === "desc" ? "rotate-180" : "",
|
|
151
|
+
"transition-transform duration-200 ease-in-out"
|
|
152
|
+
)
|
|
153
|
+
}
|
|
154
|
+
)
|
|
155
|
+
}
|
|
156
|
+
)
|
|
157
|
+
]
|
|
158
|
+
}
|
|
159
|
+
) }),
|
|
160
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tooltip.TooltipContent, { side: "top", children: [
|
|
161
|
+
"Sort by ",
|
|
162
|
+
title
|
|
163
|
+
] })
|
|
164
|
+
] }) }) })
|
|
165
|
+
);
|
|
166
|
+
SortingTableHead.displayName = "SortingTableHead";
|
|
111
167
|
// Annotate the CommonJS export names for ESM import in node:
|
|
112
168
|
0 && (module.exports = {
|
|
169
|
+
SortingTableHead,
|
|
113
170
|
Table,
|
|
114
171
|
TableBody,
|
|
115
172
|
TableCaption,
|
|
@@ -1,6 +1,14 @@
|
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { ArrowDown } from "lucide-react";
|
|
2
3
|
import * as React from "react";
|
|
3
4
|
import cn from "../utils/index.js";
|
|
5
|
+
import { Button } from "./buttons/button.js";
|
|
6
|
+
import {
|
|
7
|
+
Tooltip,
|
|
8
|
+
TooltipContent,
|
|
9
|
+
TooltipProvider,
|
|
10
|
+
TooltipTrigger
|
|
11
|
+
} from "./tooltip.js";
|
|
4
12
|
const Table = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: "rounded-xl border relative w-full overflow-auto", children: /* @__PURE__ */ jsx(
|
|
5
13
|
"table",
|
|
6
14
|
{
|
|
@@ -68,7 +76,60 @@ const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
68
76
|
}
|
|
69
77
|
));
|
|
70
78
|
TableCaption.displayName = "TableCaption";
|
|
79
|
+
const SortingTableHead = React.forwardRef(
|
|
80
|
+
({
|
|
81
|
+
title,
|
|
82
|
+
isSorted,
|
|
83
|
+
direction,
|
|
84
|
+
setSort,
|
|
85
|
+
placement = "right",
|
|
86
|
+
children,
|
|
87
|
+
className,
|
|
88
|
+
...props
|
|
89
|
+
}, ref) => /* @__PURE__ */ jsx(TableHead, { ref, className, ...props, children: /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip, { delayDuration: 200, children: [
|
|
90
|
+
/* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
|
|
91
|
+
"div",
|
|
92
|
+
{
|
|
93
|
+
className: cn(
|
|
94
|
+
"group flex items-center gap-1 w-fit cursor-pointer hover:text-white",
|
|
95
|
+
placement === "left" ? "flex-row-reverse" : "flex-row"
|
|
96
|
+
),
|
|
97
|
+
onClick: () => setSort(direction === "asc" ? "desc" : "asc"),
|
|
98
|
+
children: [
|
|
99
|
+
children,
|
|
100
|
+
/* @__PURE__ */ jsx(
|
|
101
|
+
Button,
|
|
102
|
+
{
|
|
103
|
+
variant: "ghost",
|
|
104
|
+
size: "sm",
|
|
105
|
+
className: cn(
|
|
106
|
+
"hover:bg-accent/0 group-hover:text-white p-0 h-auto",
|
|
107
|
+
isSorted ? void 0 : "opacity-0 group-hover:opacity-100"
|
|
108
|
+
),
|
|
109
|
+
children: /* @__PURE__ */ jsx(
|
|
110
|
+
ArrowDown,
|
|
111
|
+
{
|
|
112
|
+
className: cn(
|
|
113
|
+
`h-${4} w-${4}`,
|
|
114
|
+
direction === "desc" ? "rotate-180" : "",
|
|
115
|
+
"transition-transform duration-200 ease-in-out"
|
|
116
|
+
)
|
|
117
|
+
}
|
|
118
|
+
)
|
|
119
|
+
}
|
|
120
|
+
)
|
|
121
|
+
]
|
|
122
|
+
}
|
|
123
|
+
) }),
|
|
124
|
+
/* @__PURE__ */ jsxs(TooltipContent, { side: "top", children: [
|
|
125
|
+
"Sort by ",
|
|
126
|
+
title
|
|
127
|
+
] })
|
|
128
|
+
] }) }) })
|
|
129
|
+
);
|
|
130
|
+
SortingTableHead.displayName = "SortingTableHead";
|
|
71
131
|
export {
|
|
132
|
+
SortingTableHead,
|
|
72
133
|
Table,
|
|
73
134
|
TableBody,
|
|
74
135
|
TableCaption,
|
|
@@ -7,4 +7,12 @@ declare const TableRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTM
|
|
|
7
7
|
declare const TableHead: React.ForwardRefExoticComponent<React.ThHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
|
|
8
8
|
declare const TableCell: React.ForwardRefExoticComponent<React.TdHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
|
|
9
9
|
declare const TableCaption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableCaptionElement> & React.RefAttributes<HTMLTableCaptionElement>>;
|
|
10
|
-
export
|
|
10
|
+
export interface SortTableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
|
|
11
|
+
title: string;
|
|
12
|
+
isSorted: boolean;
|
|
13
|
+
direction: "asc" | "desc";
|
|
14
|
+
setSort: (direction: "asc" | "desc") => void;
|
|
15
|
+
placement?: "left" | "right";
|
|
16
|
+
}
|
|
17
|
+
declare const SortingTableHead: React.ForwardRefExoticComponent<SortTableHeadProps & React.RefAttributes<HTMLTableCellElement>>;
|
|
18
|
+
export { SortingTableHead, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, };
|