@gearbox-protocol/permissionless-ui 1.7.2 → 1.7.4

package/dist/cjs/components/auth/siwe-provider.cjs

@@ -0,0 +1,80 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const connectkit = require('connectkit');
+const siwe = require('viem/siwe');
+
+function SIWEClientProvider({
+  apiRoutePrefix,
+  statement,
+  children,
+  onRefresh,
+  ...props
+}) {
+  const getNonce = async () => {
+    const res = await fetch(`${apiRoutePrefix}/nonce`);
+    if (!res.ok) {
+      throw new Error("Failed to fetch SIWE nonce");
+    }
+    const nonce = await res.text();
+    return nonce;
+  };
+  const createMessage = ({
+    nonce,
+    address,
+    chainId
+  }) => siwe.createSiweMessage({
+    version: "1",
+    domain: window.location.host,
+    uri: window.location.origin,
+    address,
+    chainId,
+    nonce,
+    statement: statement || "Sign In With Ethereum."
+  });
+  const verifyMessage = async ({
+    message,
+    signature
+  }) => {
+    const res = await fetch(`${apiRoutePrefix}/signin`, {
+      method: "POST",
+      body: JSON.stringify({ message, signature })
+    });
+    if (!res.ok) {
+      throw new Error("Failed to verify SIWE message");
+    }
+    return true;
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    connectkit.SIWEProvider,
+    {
+      getNonce,
+      createMessage,
+      verifyMessage: async (args) => verifyMessage(args),
+      getSession: async () => {
+        const res = await fetch(`${apiRoutePrefix}/session`);
+        if (!res.ok) {
+          return null;
+        }
+        return res.json();
+      },
+      onSignIn: async (session) => {
+        onRefresh?.();
+        return session;
+      },
+      signOut: async () => {
+        await fetch(`${apiRoutePrefix}/logout`, {
+          method: "POST"
+        });
+        onRefresh?.();
+        return true;
+      },
+      ...props,
+      children
+    }
+  );
+}
+
+exports.SIWEClientProvider = SIWEClientProvider;

package/dist/cjs/components/badge/badge.cjs

@@ -0,0 +1,33 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const classVarianceAuthority = require('class-variance-authority');
+require('react');
+const utils_cn = require('../../utils/cn.cjs');
+require('sonner');
+require('@gearbox-protocol/sdk');
+
+const badgeVariants = classVarianceAuthority.cva(
+  "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 cursor-auto",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+        secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        destructive: "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
+        outline: "border-input text-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({ className, variant, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn(badgeVariants({ variant }), className), ...props });
+}
+
+exports.Badge = Badge;
+exports.badgeVariants = badgeVariants;

package/dist/cjs/components/badge/index.cjs

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_badge_badge = require('./badge.cjs');
+
+
+
+exports.Badge = components_badge_badge.Badge;
+exports.badgeVariants = components_badge_badge.badgeVariants;

package/dist/cjs/components/base-link/base-link.cjs

@@ -0,0 +1,52 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const reactSlot = require('@radix-ui/react-slot');
+const React = require('react');
+const utils_cn = require('../../utils/cn.cjs');
+require('sonner');
+require('@gearbox-protocol/sdk');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const BaseLink = React__namespace.forwardRef(
+  ({ className, asChild = false, external = false, children, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "a";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        ref,
+        className: utils_cn.cn(
+          "text-foreground no-underline hover:text-foreground/80 transition-colors",
+          className
+        ),
+        target: external ? "_blank" : void 0,
+        rel: external ? "noopener noreferrer" : void 0,
+        ...props,
+        children
+      }
+    );
+  }
+);
+BaseLink.displayName = "BaseLink";
+
+exports.BaseLink = BaseLink;

package/dist/cjs/components/base-link/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_baseLink_baseLink = require('./base-link.cjs');
+
+
+
+exports.BaseLink = components_baseLink_baseLink.BaseLink;

package/dist/cjs/components/block-sync/block-sync.cjs

@@ -0,0 +1,97 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const components_tooltip_tooltip = require('../tooltip/tooltip.cjs');
+const utils_cn = require('../../utils/cn.cjs');
+
+const TEN_MINUTES = 1e3 * 60 * 10;
+function BlockSync({
+  blockByChain,
+  explorerAddresses,
+  networkById
+}) {
+  const [latestTs, setLatestTs] = React.useState(Date.now());
+  React.useEffect(() => {
+    const syncTask = () => {
+      setLatestTs(Date.now());
+    };
+    const timer = window.setInterval(syncTask, 1e3);
+    return () => {
+      clearInterval(timer);
+    };
+  }, []);
+  const passedSinceEarliestBlockUpdate = React.useMemo(() => {
+    if (!blockByChain) return 0;
+    const blockTS = Object.values(blockByChain).reduce((minTs, block) => {
+      const ts = block.lastSyncBlock.localTimestamp;
+      if (minTs === 0) return ts;
+      if (minTs !== 0 && ts < minTs) return ts;
+      return minTs;
+    }, 0);
+    return blockTS ? latestTs - blockTS : 0;
+  }, [blockByChain, latestTs]);
+  const isError = passedSinceEarliestBlockUpdate > TEN_MINUTES;
+  const renderDot = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        className: utils_cn.cn("text-xs", isError ? "text-destructive" : "text-success"),
+        children: "Status"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: utils_cn.cn(
+          "w-2 h-2 rounded-full",
+          isError ? "bg-destructive" : "bg-success"
+        )
+      }
+    )
+  ] });
+  const renderTooltipContent = () => {
+    if (!blockByChain) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2 text-left text-xs", children: Object.entries(blockByChain).map(([chainId, blockData]) => {
+      const lastSyncBlock = blockData.lastSyncBlock;
+      const block = lastSyncBlock?.block || 0n;
+      const since = lastSyncBlock?.localTimestamp ? latestTs - lastSyncBlock.localTimestamp : 0;
+      const explorer = explorerAddresses[Number(chainId)];
+      const explorerURL = typeof explorer === "string" ? explorer : explorer && typeof explorer === "object" && "url" in explorer ? explorer.url : void 0;
+      const network = networkById[Number(chainId)] || "Unknown";
+      const blockString = `[${block.toString()}]`;
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+          network,
+          " "
+        ] }),
+        explorerURL && block > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: `${explorerURL}/block/${block}`,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "underline hover:text-foreground",
+            children: blockString
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: blockString }),
+        block > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+          ", updated ",
+          (since / 1e3).toFixed(0),
+          " seconds ago"
+        ] })
+      ] }, chainId);
+    }) });
+  };
+  if (!blockByChain) {
+    return renderDot();
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(components_tooltip_tooltip.TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(components_tooltip_tooltip.Tooltip, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(components_tooltip_tooltip.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cursor-help", children: renderDot() }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(components_tooltip_tooltip.TooltipContent, { side: "top", align: "end", children: renderTooltipContent() })
+  ] }) });
+}
+
+exports.BlockSync = BlockSync;

package/dist/cjs/components/block-sync/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_blockSync_blockSync = require('./block-sync.cjs');
+
+
+
+exports.BlockSync = components_blockSync_blockSync.BlockSync;

package/dist/cjs/components/breadcrumbs/breadcrumbs.cjs

@@ -0,0 +1,50 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const reactRouterDom = require('react-router-dom');
+require('react');
+const utils_cn = require('../../utils/cn.cjs');
+require('sonner');
+require('@gearbox-protocol/sdk');
+
+function BreadCrumbs({
+  items,
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "nav",
+    {
+      "aria-label": "breadcrumb",
+      className: utils_cn.cn("flex items-center gap-2", className),
+      children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "flex items-center gap-2 flex-wrap", children: items.map((item, index) => {
+        const isLast = index === items.length - 1;
+        const key = item.href || `${item.label}-${index}`;
+        return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center gap-2", children: [
+          item.href && !isLast ? /* @__PURE__ */ jsxRuntime.jsx(
+            reactRouterDom.Link,
+            {
+              to: item.href,
+              className: "text-sm text-muted-foreground hover:text-foreground transition-colors",
+              children: item.label
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: utils_cn.cn(
+                "text-sm",
+                isLast ? "text-foreground font-medium" : "text-muted-foreground"
+              ),
+              children: item.label
+            }
+          ),
+          !isLast && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4 text-muted-foreground" })
+        ] }, key);
+      }) })
+    }
+  );
+}
+
+exports.BreadCrumbs = BreadCrumbs;

package/dist/cjs/components/breadcrumbs/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_breadcrumbs_breadcrumbs = require('./breadcrumbs.cjs');
+
+
+
+exports.BreadCrumbs = components_breadcrumbs_breadcrumbs.BreadCrumbs;

package/dist/cjs/components/buttons/back-button/back-button.cjs

@@ -0,0 +1,63 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const classVarianceAuthority = require('class-variance-authority');
+const lucideReact = require('lucide-react');
+require('react');
+const utils_cn = require('../../../utils/cn.cjs');
+require('sonner');
+require('@gearbox-protocol/sdk');
+
+const backButtonVariants = classVarianceAuthority.cva("flex items-center transition-colors", {
+  variants: {
+    variant: {
+      default: "text-muted-foreground hover:text-foreground",
+      primary: "text-primary hover:text-primary/80",
+      ghost: "text-foreground/60 hover:text-foreground"
+    },
+    size: {
+      sm: "text-xs mb-4",
+      default: "text-sm mb-6",
+      lg: "text-base mb-8"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+function DefaultLink({
+  href,
+  className,
+  onClick,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("a", { href, className, onClick, children });
+}
+function BackButton({
+  href,
+  text,
+  onClick,
+  className,
+  variant,
+  size,
+  LinkComponent = DefaultLink
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    LinkComponent,
+    {
+      href,
+      className: utils_cn.cn(backButtonVariants({ variant, size, className })),
+      onClick,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "mr-2 h-4 w-4" }),
+        text || "Back"
+      ]
+    }
+  );
+}
+
+exports.BackButton = BackButton;
+exports.backButtonVariants = backButtonVariants;

package/dist/cjs/components/buttons/back-button/index.cjs

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_buttons_backButton_backButton = require('./back-button.cjs');
+
+
+
+exports.BackButton = components_buttons_backButton_backButton.BackButton;
+exports.backButtonVariants = components_buttons_backButton_backButton.backButtonVariants;

package/dist/cjs/components/buttons/button/button.cjs

@@ -0,0 +1,80 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const reactSlot = require('@radix-ui/react-slot');
+const classVarianceAuthority = require('class-variance-authority');
+const React = require('react');
+const utils_cn = require('../../../utils/cn.cjs');
+require('sonner');
+require('@gearbox-protocol/sdk');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors cursor-pointer disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([style*='width']):not([style*='height'])]:size-4 [&_svg]:shrink-0 border border-transparent outline-none focus-visible:outline-none",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline: "border-input bg-background shadow-sm hover:bg-secondary hover:text-foreground text-foreground",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-secondary hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
+        text: "text-muted-foreground hover:text-foreground hover:bg-transparent",
+        pink: "bg-pink-700 hover:bg-pink-600 disabled:bg-pink-700 text-primary-foreground",
+        "pink-outline": "border-pink-700 hover:border-pink-600 disabled:border-pink-700 text-foreground",
+        blue: "bg-blue-800 hover:bg-blue-700 disabled:bg-blue-700 text-primary-foreground",
+        "blue-outline": "border-blue-800 hover:border-blue-700 disabled:border-blue-800 text-foreground"
+      },
+      size: {
+        auto: "h-auto p-1.5",
+        xs: "rounded-full px-3 py-0.5 text-xs",
+        sm: "h-8 rounded-md px-3 text-xs",
+        default: "h-9 px-4 py-2",
+        lg: "h-10 rounded-md px-8",
+        icon: "h-9 w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+const Button = React__namespace.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        className: utils_cn.cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+exports.Button = Button;
+exports.buttonVariants = buttonVariants;

package/dist/cjs/components/buttons/button/index.cjs

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_buttons_button_button = require('./button.cjs');
+
+
+
+exports.Button = components_buttons_button_button.Button;
+exports.buttonVariants = components_buttons_button_button.buttonVariants;

package/dist/cjs/components/buttons/copy-button/copy-button.cjs

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const components_buttons_button_button = require('../button/button.cjs');
+const utils_cn = require('../../../utils/cn.cjs');
+const utils_copy = require('../../../utils/copy.cjs');
+require('@gearbox-protocol/sdk');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const iconSizeMap = {
+  "3": "!h-3 !w-3",
+  "3.5": "!h-3.5 !w-3.5",
+  "4": "!h-4 !w-4",
+  "5": "!h-5 !w-5",
+  "6": "!h-6 !w-6"
+};
+const CopyButton = React__namespace.forwardRef(
+  ({ text, name, className, iconSize = "3.5", ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      components_buttons_button_button.Button,
+      {
+        ref,
+        variant: "text",
+        size: "auto",
+        className,
+        onClick: () => utils_copy.copyToClipboard({ text, name }),
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, { className: utils_cn.cn(iconSizeMap[iconSize]) })
+      }
+    );
+  }
+);
+CopyButton.displayName = "CopyButton";
+
+exports.CopyButton = CopyButton;

package/dist/cjs/components/buttons/copy-button/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_buttons_copyButton_copyButton = require('./copy-button.cjs');
+
+
+
+exports.CopyButton = components_buttons_copyButton_copyButton.CopyButton;

package/dist/cjs/components/buttons/external-button/external-button.cjs

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const components_buttons_button_button = require('../button/button.cjs');
+const utils_cn = require('../../../utils/cn.cjs');
+require('sonner');
+require('@gearbox-protocol/sdk');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const iconSizeMap = {
+  "3": "!h-3 !w-3",
+  "3.5": "!h-3.5 !w-3.5",
+  "4": "!h-4 !w-4",
+  "5": "!h-5 !w-5",
+  "6": "!h-6 !w-6"
+};
+const ExternalButton = React__namespace.forwardRef(
+  ({ url, className, iconSize = "3.5", ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      components_buttons_button_button.Button,
+      {
+        ref,
+        variant: "text",
+        size: "auto",
+        className,
+        onClick: () => window.open(url, "_blank"),
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ExternalLink, { className: utils_cn.cn(iconSizeMap[iconSize]) })
+      }
+    );
+  }
+);
+ExternalButton.displayName = "ExternalButton";
+
+exports.ExternalButton = ExternalButton;

package/dist/cjs/components/buttons/external-button/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const components_buttons_externalButton_externalButton = require('./external-button.cjs');
+
+
+
+exports.ExternalButton = components_buttons_externalButton_externalButton.ExternalButton;