@gearbox-protocol/ui-kit 2.1.0-next.1

package/dist/esm/components/block-sync/block-sync.js

@@ -0,0 +1,226 @@
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useState as h, useEffect as w, useMemo as E } from "react";
+import { SimpleTooltip as j } from "../tooltip/simple-tooltip.js";
+import "../tooltip/tooltip.js";
+import { cn as x } from "../../utils/cn.js";
+import "../accordion/accordion.js";
+import "@gearbox-protocol/static";
+import "@fortawesome/free-solid-svg-icons";
+import "../icons/fa-icon.js";
+import "@gearbox-protocol/sdk";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../utils/z-index.js";
+import "../alert-badge/alert-badge.js";
+import "../alert-dialog/alert-dialog.js";
+import "../alert-modal/alert-modal.js";
+import "react-intl";
+import "../arc-loader/arc-loader.js";
+import "../asset-line/asset-line.js";
+import "../buttons/back-button/back-button.js";
+import "../buttons/button/button.js";
+import "../buttons/copy-button/copy-button.js";
+import "../buttons/external-button/external-button.js";
+import "../buttons/filter-button/filter-button.js";
+import "../buttons/navigation-button/navigation-button.js";
+import "../buttons/tab-button/tab-button.js";
+import "../token-icon/token-icon.js";
+import "wagmi";
+import "../auth/wallet-ui-context.js";
+import "../avatar/avatar.js";
+import "../badge/badge.js";
+import "../base-link/base-link.js";
+import "../navigation-context/navigation-context.js";
+import "../button-checkbox/button-checkbox.js";
+import "../card-grid/card-grid.js";
+import "../cards/card/card.js";
+import "../carousel/carousel.js";
+import "../checkbox/checkbox.js";
+import "../checkbox/checkbox-labeled.js";
+import "../checkbox-item/checkbox-item.js";
+import "../client-adapters/styled-button/styled-button.js";
+import "../client-adapters/styled-dialog-container/styled-dialog-container.js";
+import "../client-adapters/styled-rounded-image/styled-rounded-image.js";
+import "../colored-text/colored-text.js";
+import "../input/input.js";
+import "../with-title/with-title.js";
+import "../smart-number-input/balance-indicator.js";
+import "../smart-number-input/smart-number-input.js";
+import "../points-icon/points-icon.js";
+import "../skeleton/skeleton.js";
+import "../vertical-indicator/vertical-indicator.js";
+import "../vertical-list/vertical-list.js";
+import "../confirm-menu/confirm-menu.js";
+import "../currency-button/currency-button.js";
+import "../description/description.js";
+import "../detailed-apy/detailed-apy.js";
+import "../detailed-page-title/detailed-page-title.js";
+import "../detailed-page-title/detailed-page-title-copy-button.js";
+import "../detailed-page-title/detailed-page-title-explorer-dropdown.js";
+import "../modal/modal.js";
+import "@radix-ui/react-dialog";
+import "../dialog/dialog-container.js";
+import "../dialog/dialog-content.js";
+import "../dialog/dialog-description.js";
+import "../dialog/dialog-footer.js";
+import "../dialog/dialog-header.js";
+import "../dialog/dialog-title.js";
+import "../dialog/dialog-modal-container.js";
+import "../dialog/dialog-overlay.js";
+import "viem";
+import "../label/label.js";
+import "../dropdown-menu/dropdown-menu.js";
+import "../dropdown-menu/dropdown-menu-checkbox-item.js";
+import "../dropdown-menu/dropdown-menu-content.js";
+import "../dropdown-menu/dropdown-menu-item.js";
+import "../dropdown-menu/dropdown-menu-label.js";
+import "../dropdown-menu/dropdown-menu-radio-item.js";
+import "../dropdown-menu/dropdown-menu-separator.js";
+import "../dropdown-menu/dropdown-menu-shortcut.js";
+import "../dropdown-menu/dropdown-menu-sub-content.js";
+import "../dropdown-menu/dropdown-menu-sub-trigger.js";
+import "../edit-input/edit-input.js";
+import "../fadeout-loading/fadeout-loading.js";
+import "../filter/filter-block.js";
+import "../filter/filter-checkbox-item.js";
+import "../filter/filter-chip.js";
+import "../filter/filter-chips.js";
+import "../filter/filter-dropdown-item.js";
+import "../filter/filter-group.js";
+import "../filter/filter-label.js";
+import "../search-line/search-line.js";
+import "../tabs/tabs.js";
+import "../filter/filter-modal-item.js";
+import "../filter/filter-radio-item.js";
+import "../filter/filter-separator.js";
+import "../filter/variants.js";
+import "../graph/formatters.js";
+import "lightweight-charts";
+import "../graph/graph-view.js";
+import "../help-tip/help-tip.js";
+import "../health-factor/health-factor.js";
+import "../horizontal-indicator/horizontal-indicator.js";
+import "../icon-button/icon-button.js";
+import "../layout/col/col.js";
+import "../layout/container/container.js";
+import "../layout/footer/footer.js";
+import "../layout/grid/grid.js";
+import "../layout/header/header.js";
+import "../layout/layout/layout.js";
+import "../page-title/page-title.js";
+import "../layout/social-icons/social-icons.js";
+import "../link/link.js";
+import "../token-symbol/token-symbol.js";
+import "../../utils/reactochart-compat.js";
+import "../status-elements/status-elements.js";
+import "../text-button/text-button.js";
+import "../loader/loader.js";
+import "../loading/loading.js";
+import "../loading-bar/loading-bar.js";
+import "react-markdown";
+import "remark-gfm";
+import "../navbar/navbar.js";
+import "../navbar/navbar-indicator-context.js";
+import "../app-bar/app-bar.js";
+import "../navitem/navitem.js";
+import "../simple-dropdown/simple-dropdown.js";
+import "../progress/progress.js";
+import "../pool-indicator-icon/pool-indicator-icon.js";
+import "../progress-bar/progress-bar.js";
+import "../radio-group/radio-group.js";
+import "../rounded-image/rounded-image.js";
+import "../search-bar/search-bar.js";
+import "../segmented-control/segmented-control.js";
+import "../select/select.js";
+import "../separate-line/separate-line.js";
+import "../separator/separator.js";
+import "../simple-accordion/simple-accordion.js";
+import "../simple-dropdown/simple-dropdown-menu-item.js";
+import "../slider/slider.js";
+import "../slider/slider-context.js";
+import "@radix-ui/react-slider";
+import "../spinner/spinner.js";
+import "../spinner-loader/spinner-loader.js";
+import "../split-list/split-list.js";
+import "../stat-badge/stat-badge.js";
+import { StatusDot as U } from "../status-dot/status-dot.js";
+import "../stepper/stepper.js";
+import "../switch/switch.js";
+import "../table/grid-table.js";
+import "../table/table.js";
+import "../table/grid-table-loader.js";
+import "../textarea/textarea.js";
+import "../theme-provider.js";
+import "../time-to-liquidation/time-to-liquidation.js";
+import "../tip-card/tip-card.js";
+import "../toggle/toggle.js";
+import "../typography/typography.js";
+import "../with-filter-button/with-filter-button.js";
+const D = 1e3 * 60 * 10;
+function Do({
+  blockByChain: i,
+  explorerAddresses: S,
+  networkById: v
+}) {
+  const [n, k] = h(Date.now());
+  w(() => {
+    const r = () => {
+      k(Date.now());
+    }, t = window.setInterval(r, 1e3);
+    return () => {
+      clearInterval(t);
+    };
+  }, []);
+  const a = E(() => {
+    if (!i) return 0;
+    const r = Object.values(i).reduce((t, c) => {
+      const m = c.lastSyncBlock.localTimestamp;
+      return t === 0 || t !== 0 && m < t ? m : t;
+    }, 0);
+    return r ? n - r : 0;
+  }, [i, n]) > D, d = () => /* @__PURE__ */ s("div", { className: "flex h-[30px] items-center gap-1.5", children: [
+    /* @__PURE__ */ o(
+      "span",
+      {
+        className: x(
+          "text-sm leading-[17px]",
+          a ? "text-destructive" : "text-success"
+        ),
+        children: "Status"
+      }
+    ),
+    /* @__PURE__ */ o(U, { variant: a ? "alert" : "success" })
+  ] }), N = () => {
+    if (!i) return null;
+    const r = Object.entries(i);
+    return /* @__PURE__ */ o("div", { className: "flex flex-col text-left text-xs", children: r.map(([t, c], m) => {
+      const l = c.lastSyncBlock, e = l?.block || 0n, g = l?.localTimestamp ? n - l.localTimestamp : 0, p = S[Number(t)], u = typeof p == "string" ? p : p && typeof p == "object" && "url" in p ? p.url : void 0, T = v[Number(t)] || "Unknown", f = `[${e.toString()}]`, b = m === r.length - 1;
+      return /* @__PURE__ */ s("div", { className: x(!b && "mb-2"), children: [
+        /* @__PURE__ */ s("span", { children: [
+          T,
+          " "
+        ] }),
+        u && e > 0 ? /* @__PURE__ */ o(
+          "a",
+          {
+            href: `${u}/block/${e}`,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "underline hover:text-foreground",
+            children: f
+          }
+        ) : /* @__PURE__ */ o("span", { children: f }),
+        e > 0 && /* @__PURE__ */ s("span", { children: [
+          ", updated ",
+          (g / 1e3).toFixed(0),
+          " seconds ago"
+        ] })
+      ] }, t);
+    }) });
+  };
+  return i ? /* @__PURE__ */ o(j, { title: d(), children: N() }) : /* @__PURE__ */ o("div", { className: "select-none", children: d() });
+}
+export {
+  Do as BlockSync
+};

package/dist/esm/components/block-sync/index.js

@@ -0,0 +1,4 @@
+import { BlockSync as r } from "./block-sync.js";
+export {
+  r as BlockSync
+};

package/dist/esm/components/breadcrumbs/breadcrumbs.js

@@ -0,0 +1,66 @@
+import { jsx as r, jsxs as h } from "react/jsx-runtime";
+import { IconExpand as x } from "@gearbox-protocol/static";
+import { useNavigationAdapter as N } from "../navigation-context/navigation-context.js";
+import "react";
+import "@gearbox-protocol/sdk";
+import { cn as c } from "../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../utils/z-index.js";
+const u = "text-sm! transition-colors text-muted-foreground! hover:text-foreground!";
+function T({
+  items: n,
+  onClick: d,
+  currentStep: m,
+  disabledSteps: p,
+  className: f
+}) {
+  const { Link: g } = N();
+  return !n || n.length === 0 ? null : /* @__PURE__ */ r("nav", { "aria-label": "breadcrumb", className: c("flex items-center", f), children: /* @__PURE__ */ r("ol", { className: "flex items-center gap-2.5 flex-wrap", children: n.map((e, t, i) => {
+    const { href: o } = e, s = t === i.length - 1, a = m === t, l = p?.(e, t) ?? !1, b = o || e.step || `${e.label}-${t}`;
+    return /* @__PURE__ */ h("li", { className: "group flex items-center gap-2", children: [
+      !!o && !s && !a && !l ? (
+        // Navigation with href
+        /* @__PURE__ */ r(g, { to: o, className: u, children: e.label })
+      ) : !!d && !o && !s && !a && !l ? (
+        // Wizard mode: use button
+        /* @__PURE__ */ r(
+          "button",
+          {
+            type: "button",
+            onClick: () => d(e, t),
+            disabled: l,
+            className: c(u, "cursor-pointer"),
+            children: e.label
+          }
+        )
+      ) : (
+        // Last item or no href/button
+        /* @__PURE__ */ r(
+          "span",
+          {
+            className: c(
+              "text-sm",
+              a ? "text-foreground" : "text-muted-foreground"
+            ),
+            children: e.label
+          }
+        )
+      ),
+      (!s || i.length === 1) && /* @__PURE__ */ r(
+        x,
+        {
+          size: 10,
+          className: "text-muted-foreground group-hover:text-foreground transition-colors",
+          style: {
+            transform: "rotate(-90deg)"
+          }
+        }
+      )
+    ] }, b);
+  }) }) });
+}
+export {
+  T as BreadCrumbs
+};

package/dist/esm/components/breadcrumbs/index.js

@@ -0,0 +1,4 @@
+import { BreadCrumbs as m } from "./breadcrumbs.js";
+export {
+  m as BreadCrumbs
+};

package/dist/esm/components/button-checkbox/button-checkbox.js

@@ -0,0 +1,54 @@
+import { jsxs as i, jsx as m } from "react/jsx-runtime";
+import { cva as p } from "class-variance-authority";
+import * as d from "react";
+import "@gearbox-protocol/sdk";
+import { cn as s } from "../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../utils/z-index.js";
+const u = p(
+  [
+    "flex cursor-pointer select-none items-center border rounded-md p-3",
+    "mb-0 border-gray-20",
+    "data-[checked=true]:outline data-[checked=true]:outline-2 data-[checked=true]:outline-primary"
+  ].join(" ")
+), l = d.forwardRef(
+  ({
+    checked: e,
+    disabled: o = !1,
+    onChange: t,
+    children: r,
+    className: a,
+    ...c
+  }, n) => /* @__PURE__ */ i(
+    "label",
+    {
+      ...c,
+      ref: n,
+      "data-checked": e,
+      className: s(
+        u(),
+        o && "cursor-not-allowed opacity-50",
+        a
+      ),
+      children: [
+        r,
+        /* @__PURE__ */ m(
+          "input",
+          {
+            type: "checkbox",
+            checked: e,
+            onChange: () => t?.(),
+            disabled: o,
+            className: "hidden"
+          }
+        )
+      ]
+    }
+  )
+);
+l.displayName = "ButtonCheckbox";
+export {
+  l as ButtonCheckbox
+};

package/dist/esm/components/button-checkbox/index.js

@@ -0,0 +1,4 @@
+import { ButtonCheckbox as e } from "./button-checkbox.js";
+export {
+  e as ButtonCheckbox
+};

package/dist/esm/components/buttons/back-button/back-button.js

@@ -0,0 +1,63 @@
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import { cva as f } from "class-variance-authority";
+import { faArrowLeft as u } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as c } from "../../icons/fa-icon.js";
+import "react";
+import "@gearbox-protocol/sdk";
+import { cn as p } from "../../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../utils/z-index.js";
+const x = f("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",
+      default: "text-sm",
+      lg: "text-base"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+function l({
+  href: t,
+  className: r,
+  onClick: o,
+  children: e
+}) {
+  return /* @__PURE__ */ a("a", { href: t, className: r, onClick: o, children: e });
+}
+function N({
+  href: t,
+  text: r,
+  onClick: o,
+  className: e,
+  variant: i,
+  size: m,
+  LinkComponent: n = l
+}) {
+  return /* @__PURE__ */ s(
+    n,
+    {
+      href: t,
+      className: p(x({ variant: i, size: m, className: e })),
+      onClick: o,
+      children: [
+        /* @__PURE__ */ a(c, { icon: u, className: "mr-2 size-4" }),
+        r || "Back"
+      ]
+    }
+  );
+}
+export {
+  N as BackButton,
+  x as backButtonVariants
+};

package/dist/esm/components/buttons/back-button/index.js

@@ -0,0 +1,5 @@
+import { BackButton as o, backButtonVariants as n } from "./back-button.js";
+export {
+  o as BackButton,
+  n as backButtonVariants
+};

package/dist/esm/components/buttons/button/button.js

@@ -0,0 +1,108 @@
+import { jsx as u } from "react/jsx-runtime";
+import { Slot as c } from "@radix-ui/react-slot";
+import { cva as x } from "class-variance-authority";
+import * as y from "react";
+import "@gearbox-protocol/sdk";
+import { cn as e } from "../../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../utils/z-index.js";
+const h = x(
+  // TODO: remove !
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors cursor-pointer disabled:!cursor-not-allowed [&_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: e(
+          "text-primary-foreground bg-primary border border-primary",
+          "hover:bg-accent hover:border-accent",
+          "disabled:text-secondary-foreground disabled:bg-gray-20 disabled:border-gray-20"
+        ),
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90 disabled:opacity-50",
+        outline: e(
+          "text-primary-foreground bg-transparent border border-gray-40",
+          "hover:bg-gray-60 hover:border-gray-60",
+          "disabled:text-secondary-foreground disabled:bg-gray-20 disabled:border-gray-20"
+        ),
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80 disabled:opacity-50",
+        ghost: "hover:bg-secondary hover:text-accent-foreground disabled:opacity-50",
+        white: e(
+          "font-medium text-white-foreground bg-white border border-white",
+          "shadow-[0_1px_1px_0_rgba(0,0,0,0.15)]",
+          "hover:shadow-[0_3px_3px_0_rgba(0,0,0,0.25)]",
+          "disabled:text-gray-80 disabled:bg-gray-110 disabled:border-gray-110",
+          "disabled:shadow-[0_1px_1px_0_rgba(0,0,0,0.15)]"
+        ),
+        neutral: e(
+          "text-primary-foreground bg-gray-60 border border-gray-60",
+          "hover:bg-gray-90 hover:border-gray-90",
+          "disabled:text-secondary-foreground disabled:bg-gray-20 disabled:border-gray-20"
+        ),
+        success: e(
+          "font-medium text-success-foreground bg-success border border-success",
+          "hover:bg-success-hover hover:border-success-hover",
+          "disabled:text-secondary-foreground disabled:bg-gray-20 disabled:border-gray-20"
+        ),
+        link: "text-primary underline-offset-4 hover:underline disabled:opacity-50",
+        text: "text-muted-foreground hover:text-foreground hover:bg-transparent disabled:opacity-50",
+        pink: "bg-pink-700 hover:bg-pink-600 disabled:bg-pink-700 text-primary-foreground disabled:opacity-50",
+        "pink-outline": "border-pink-700 hover:border-pink-600 disabled:border-pink-700 text-foreground disabled:opacity-50",
+        blue: "bg-blue-800 hover:bg-blue-700 disabled:bg-blue-700 text-primary-foreground disabled:opacity-50",
+        "blue-outline": "border-blue-800 hover:border-blue-700 disabled:border-blue-800 text-foreground disabled:opacity-50"
+      },
+      // TODO: remove !
+      size: {
+        auto: "h-auto p-1.5",
+        xs: "px-3 py-0.5 text-xs rounded-full",
+        sm: "h-7 px-3 !text-xs !leading-[14px] rounded-[6px]",
+        default: "px-4 h-[40px] !text-[15px] !leading-[18px] rounded-[12px]",
+        lg: "px-4 h-[44px] !text-[16px] !leading-[19px] rounded-[22px]",
+        icon: "h-9 w-9 p-2"
+      },
+      width: {
+        compact: "w-auto",
+        wide: "w-full"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      width: "compact"
+    }
+  }
+), f = y.forwardRef(
+  ({
+    className: t,
+    variant: d,
+    size: a,
+    width: i,
+    asChild: s = !1,
+    disabled: o,
+    onClick: n,
+    ...b
+  }, g) => {
+    const l = s ? c : "button", p = (r) => {
+      if (o) {
+        r.preventDefault(), r.stopPropagation();
+        return;
+      }
+      n?.(r);
+    };
+    return /* @__PURE__ */ u(
+      l,
+      {
+        className: e(h({ variant: d, size: a, className: t, width: i })),
+        ref: g,
+        disabled: o,
+        onClick: p,
+        ...b
+      }
+    );
+  }
+);
+f.displayName = "Button";
+export {
+  f as Button,
+  h as buttonVariants
+};

package/dist/esm/components/buttons/button/index.js

@@ -0,0 +1,5 @@
+import { Button as n, buttonVariants as r } from "./button.js";
+export {
+  n as Button,
+  r as buttonVariants
+};

package/dist/esm/components/buttons/copy-button/copy-button.js

@@ -0,0 +1,75 @@
+import { jsxs as y, jsx as t } from "react/jsx-runtime";
+import { IconCopy as h } from "@gearbox-protocol/static";
+import * as r from "react";
+import { Button as C } from "../button/button.js";
+import { faCheck as x } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as w } from "../../icons/fa-icon.js";
+import "@gearbox-protocol/sdk";
+import { cn as i } from "../../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../utils/z-index.js";
+const N = {
+  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"
+}, b = {
+  3: 12,
+  "3.5": 14,
+  4: 16,
+  5: 20,
+  6: 24
+}, j = r.forwardRef(
+  ({ text: n, className: l, iconSize: a = "3.5", successDuration: p = 1500, ...m }, u) => {
+    const [e, s] = r.useState(!1), o = r.useRef(null), f = async () => {
+      try {
+        await navigator.clipboard.writeText(n), o.current && clearTimeout(o.current), s(!0), o.current = setTimeout(() => {
+          s(!1);
+        }, p);
+      } catch (d) {
+        console.error("Failed to copy:", d);
+      }
+    }, c = N[a];
+    return /* @__PURE__ */ y(
+      C,
+      {
+        ref: u,
+        variant: "text",
+        size: "auto",
+        className: i("p-1! border-0! relative", l),
+        onClick: f,
+        title: e ? "Copied!" : "Copy to clipboard",
+        ...m,
+        children: [
+          /* @__PURE__ */ t(
+            "span",
+            {
+              className: i(
+                "absolute inset-0 flex items-center justify-center transition-all duration-200",
+                e ? "opacity-100 scale-100 text-green-500" : "opacity-0 scale-50 text-green-500"
+              ),
+              children: /* @__PURE__ */ t(w, { icon: x, className: c })
+            }
+          ),
+          /* @__PURE__ */ t(
+            "span",
+            {
+              className: i(
+                "flex items-center justify-center transition-all duration-200",
+                e ? "opacity-0 scale-50" : "opacity-100 scale-100"
+              ),
+              children: /* @__PURE__ */ t(h, { size: b[a], className: c })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+j.displayName = "CopyButton";
+export {
+  j as CopyButton
+};

package/dist/esm/components/buttons/copy-button/index.js

@@ -0,0 +1,4 @@
+import { CopyButton as p } from "./copy-button.js";
+export {
+  p as CopyButton
+};

package/dist/esm/components/buttons/external-button/external-button.js

@@ -0,0 +1,46 @@
+import { jsx as t } from "react/jsx-runtime";
+import { IconExternal as e } from "@gearbox-protocol/static";
+import * as p from "react";
+import { Button as s } from "../button/button.js";
+import "@gearbox-protocol/sdk";
+import { cn as r } from "../../../utils/cn.js";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../utils/z-index.js";
+const c = {
+  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"
+}, l = {
+  3: 12,
+  "3.5": 14,
+  4: 16,
+  5: 20,
+  6: 24
+}, w = p.forwardRef(
+  ({ url: i, className: n, iconSize: o = "3.5", ...m }, a) => /* @__PURE__ */ t(
+    s,
+    {
+      ref: a,
+      variant: "text",
+      size: "auto",
+      className: r("p-1! border-0!", n),
+      onClick: () => window.open(i, "_blank"),
+      ...m,
+      children: /* @__PURE__ */ t(
+        e,
+        {
+          size: l[o],
+          className: r(c[o])
+        }
+      )
+    }
+  )
+);
+w.displayName = "ExternalButton";
+export {
+  w as ExternalButton
+};