@gearbox-protocol/permissionless-ui 1.2.14 → 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.
@@ -44,6 +44,7 @@ var import_lucide_react = require("lucide-react");
44
44
  var React = __toESM(require("react"));
45
45
  var import_utils = __toESM(require('../utils/index.js'));
46
46
  var import_button = require('./buttons/button.js');
47
+ var import_tooltip = require('./tooltip.js');
47
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)(
48
49
  "table",
49
50
  {
@@ -113,6 +114,7 @@ const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PU
113
114
  TableCaption.displayName = "TableCaption";
114
115
  const SortingTableHead = React.forwardRef(
115
116
  ({
117
+ title,
116
118
  isSorted,
117
119
  direction,
118
120
  setSort,
@@ -120,42 +122,48 @@ const SortingTableHead = React.forwardRef(
120
122
  children,
121
123
  className,
122
124
  ...props
123
- }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { ref, className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
124
- "div",
125
- {
126
- className: (0, import_utils.default)(
127
- "group flex items-center gap-1 w-fit cursor-pointer hover:text-white",
128
- placement === "left" ? "flex-row-reverse" : "flex-row"
129
- ),
130
- onClick: () => setSort(direction === "asc" ? "desc" : "asc"),
131
- children: [
132
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children }),
133
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
134
- import_button.Button,
135
- {
136
- variant: "ghost",
137
- size: "sm",
138
- className: (0, import_utils.default)(
139
- "hover:bg-accent/0 group-hover:text-white p-0 h-auto",
140
- isSorted ? void 0 : "opacity-0 group-hover:opacity-100"
141
- ),
142
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
143
- import_lucide_react.ArrowDown,
144
- {
145
- className: (0, import_utils.default)(
146
- `h-${4} w-${4}`,
147
- direction === "desc" ? "rotate-180" : "",
148
- "transition-transform duration-200 ease-in-out"
149
- )
150
- }
151
- )
152
- }
153
- )
154
- ]
155
- }
156
- ) })
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
+ ] }) }) })
157
165
  );
158
- SortingTableHead.displayName = "SortTableHead";
166
+ SortingTableHead.displayName = "SortingTableHead";
159
167
  // Annotate the CommonJS export names for ESM import in node:
160
168
  0 && (module.exports = {
161
169
  SortingTableHead,
@@ -3,6 +3,12 @@ import { ArrowDown } from "lucide-react";
3
3
  import * as React from "react";
4
4
  import cn from "../utils/index.js";
5
5
  import { Button } from "./buttons/button.js";
6
+ import {
7
+ Tooltip,
8
+ TooltipContent,
9
+ TooltipProvider,
10
+ TooltipTrigger
11
+ } from "./tooltip.js";
6
12
  const Table = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: "rounded-xl border relative w-full overflow-auto", children: /* @__PURE__ */ jsx(
7
13
  "table",
8
14
  {
@@ -72,6 +78,7 @@ const TableCaption = React.forwardRef(({ className, ...props }, ref) => /* @__PU
72
78
  TableCaption.displayName = "TableCaption";
73
79
  const SortingTableHead = React.forwardRef(
74
80
  ({
81
+ title,
75
82
  isSorted,
76
83
  direction,
77
84
  setSort,
@@ -79,42 +86,48 @@ const SortingTableHead = React.forwardRef(
79
86
  children,
80
87
  className,
81
88
  ...props
82
- }, ref) => /* @__PURE__ */ jsx(TableHead, { ref, className, ...props, children: /* @__PURE__ */ jsxs(
83
- "div",
84
- {
85
- className: cn(
86
- "group flex items-center gap-1 w-fit cursor-pointer hover:text-white",
87
- placement === "left" ? "flex-row-reverse" : "flex-row"
88
- ),
89
- onClick: () => setSort(direction === "asc" ? "desc" : "asc"),
90
- children: [
91
- /* @__PURE__ */ jsx("span", { children }),
92
- /* @__PURE__ */ jsx(
93
- Button,
94
- {
95
- variant: "ghost",
96
- size: "sm",
97
- className: cn(
98
- "hover:bg-accent/0 group-hover:text-white p-0 h-auto",
99
- isSorted ? void 0 : "opacity-0 group-hover:opacity-100"
100
- ),
101
- children: /* @__PURE__ */ jsx(
102
- ArrowDown,
103
- {
104
- className: cn(
105
- `h-${4} w-${4}`,
106
- direction === "desc" ? "rotate-180" : "",
107
- "transition-transform duration-200 ease-in-out"
108
- )
109
- }
110
- )
111
- }
112
- )
113
- ]
114
- }
115
- ) })
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
+ ] }) }) })
116
129
  );
117
- SortingTableHead.displayName = "SortTableHead";
130
+ SortingTableHead.displayName = "SortingTableHead";
118
131
  export {
119
132
  SortingTableHead,
120
133
  Table,
@@ -8,6 +8,7 @@ declare const TableHead: React.ForwardRefExoticComponent<React.ThHTMLAttributes<
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
10
  export interface SortTableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
11
+ title: string;
11
12
  isSorted: boolean;
12
13
  direction: "asc" | "desc";
13
14
  setSort: (direction: "asc" | "desc") => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gearbox-protocol/permissionless-ui",
3
- "version": "1.2.14",
3
+ "version": "1.2.15",
4
4
  "description": "Internal UI components",
5
5
  "license": "MIT",
6
6
  "main": "./dist/cjs/index.js",