@gearbox-protocol/permissionless-ui 1.22.0-next.4 → 1.22.0-next.40

package/dist/esm/components/compound-apy/compound-apy.js

@@ -1,142 +1,132 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import * as h from "react";
-import { Description as g } from "../description/description.js";
-import { TokenIcon as N } from "../token-icon/token-icon.js";
-import { TooltipProvider as P, Tooltip as A, TooltipTrigger as Y, TooltipContent as z } from "../tooltip/tooltip.js";
-import { FormattedMessageTyped as r } from "../typed-intl/index.js";
-import { cn as u } from "../../utils/cn.js";
-import "sonner";
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { IconInfo as S, IconLighting as j } from "@gearbox-protocol/static";
+import * as u from "react";
+import { Description as N } from "../description/description.js";
+import { TokenIcon as b } from "../token-icon/token-icon.js";
+import "../tooltip/simple-tooltip.js";
+import { TooltipProvider as A, Tooltip as Y, TooltipTrigger as $, TooltipContent as z } from "../tooltip/tooltip.js";
+import { FormattedMessageTyped as i } from "../typed-intl/index.js";
 import "@gearbox-protocol/sdk";
-import { formatPercentAmount as s } from "../../utils/format-money.js";
-function D({
-  totalAPY: l,
-  totalAPYLoading: b,
-  baseAPY: f,
-  extraAPY: x,
-  externalAPY: i,
-  tokensList: y,
-  decimals: o = 2,
+import { cn as f } from "../../utils/cn.js";
+import "sonner";
+import { formatPercentAmount as r } from "../../utils/format-money.js";
+import { getStatic as C } from "../../utils/static.js";
+function v(s) {
+  return s === "GEAR" ? { icon: C("/logo/logo_symbol.png") } : s;
+}
+function H({
+  totalAPY: s,
+  totalAPYLoading: T,
+  baseAPY: h,
+  extraAPY: y,
+  externalAPY: l,
+  tokensList: g,
+  decimals: a = 2,
   className: c
 }) {
-  const n = h.useMemo(() => {
-    if (i)
+  const o = u.useMemo(() => {
+    if (l)
       return {
-        ...i,
-        value: i.value ?? i.apy ?? 0
+        ...l,
+        value: l.value ?? l.apy ?? 0
       };
-  }, [i]), d = h.useMemo(() => x.filter((t) => (t.apy || 0) > 0), [x]), v = d.length > 0, p = n && n.totalValue > 0 && n.totalValue !== l, k = v || p || f.length > 1, T = h.useMemo(() => `${[
-    s(l, o),
-    ...p ? [s(n.totalValue, o)] : []
-  ].join("-")}%`, [l, p, n, o]);
-  if (b)
+  }, [l]), p = u.useMemo(() => y.filter((n) => (n.apy || 0) > 0), [y]), x = p.length > 0, d = o && o.totalValue > 0 && o.totalValue !== s, k = x || d || h.length > 1, I = u.useMemo(() => `${[
+    r(s, a),
+    ...d ? [r(o.totalValue, a)] : []
+  ].join("-")}%`, [s, d, o, a]);
+  if (T)
     return /* @__PURE__ */ e(
       "div",
       {
-        className: u(
+        className: f(
           "font-medium animate-pulse bg-muted rounded w-16 h-4",
           c
         )
       }
     );
   if (!k)
-    return /* @__PURE__ */ a("div", { className: u("font-medium", c), children: [
-      s(l, o),
+    return /* @__PURE__ */ t("div", { className: f("font-medium", c), children: [
+      r(s, a),
       "%"
     ] });
   const w = {
     supplyAPY: "components.apyParts.supplyAPY",
     tokenYield: "components.apyParts.tokenYield"
-  }, I = {
+  }, E = {
     supplyAPY: "components.apyParts.supplyAPY.tip",
     tokenYield: "components.apyParts.tokenYield.tip"
   };
-  return /* @__PURE__ */ e(P, { children: /* @__PURE__ */ a(A, { children: [
-    /* @__PURE__ */ e(Y, { asChild: !0, children: /* @__PURE__ */ a("div", { className: "inline-flex flex-col", children: [
-      /* @__PURE__ */ a(
+  return /* @__PURE__ */ e(A, { children: /* @__PURE__ */ t(Y, { children: [
+    /* @__PURE__ */ e($, { asChild: !0, children: /* @__PURE__ */ t("div", { className: "inline-flex flex-col", children: [
+      /* @__PURE__ */ t(
         "div",
         {
-          className: u(
+          className: f(
             "inline-flex items-center gap-1.5 font-medium cursor-help",
             c
           ),
           children: [
-            T,
-            /* @__PURE__ */ a(
-              "svg",
-              {
-                className: "h-3.5 w-3.5 ",
-                fill: "none",
-                viewBox: "0 0 24 24",
-                stroke: "currentColor",
-                role: "img",
-                "aria-label": "APY Information",
-                children: [
-                  /* @__PURE__ */ e("title", { children: "APY Information" }),
-                  /* @__PURE__ */ e(
-                    "path",
-                    {
-                      strokeLinecap: "round",
-                      strokeLinejoin: "round",
-                      strokeWidth: 2,
-                      d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-                    }
-                  )
-                ]
-              }
-            )
+            I,
+            /* @__PURE__ */ e("span", { className: "text-muted-foreground leading-none", children: /* @__PURE__ */ e(S, { size: 14 }) })
           ]
         }
       ),
-      v && /* @__PURE__ */ e("div", { className: "flex gap-1 mt-1 justify-end", children: d.map((t) => {
-        const m = y?.[t.rewardToken]?.symbol || t.rewardTokenSymbol;
+      x && /* @__PURE__ */ e("div", { className: "flex gap-1 mt-1 justify-end", children: p.map((n) => {
+        const m = g?.[n.rewardToken]?.symbol || n.rewardTokenSymbol;
         return /* @__PURE__ */ e(
-          N,
+          b,
           {
-            symbol: m,
+            symbol: v(m),
             size: 18
           },
-          `icon-${t.rewardToken}-${t.apy}`
+          `icon-${n.rewardToken}-${n.apy}`
         );
       }) })
     ] }) }),
-    /* @__PURE__ */ e(z, { className: "max-w-xs", children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-2 text-sm", children: [
-      f.map((t) => /* @__PURE__ */ a(
+    /* @__PURE__ */ e(z, { className: "max-w-xs", children: /* @__PURE__ */ t("div", { className: "flex flex-col gap-2 text-sm", children: [
+      h.map((n) => /* @__PURE__ */ t(
         "div",
         {
           className: "flex justify-between items-start gap-4",
           children: [
-            /* @__PURE__ */ a("div", { className: "flex flex-col gap-0.5", children: [
-              /* @__PURE__ */ a("span", { className: "", children: [
-                /* @__PURE__ */ e(r, { messageId: w[t.type] }),
+            /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5", children: [
+              /* @__PURE__ */ t("span", { className: "", children: [
+                /* @__PURE__ */ e(i, { messageId: w[n.type] }),
                 ":"
               ] }),
-              /* @__PURE__ */ e(g, { className: "text-xs", children: /* @__PURE__ */ e(
-                r,
+              /* @__PURE__ */ e(N, { className: "text-xs", children: /* @__PURE__ */ e(
+                i,
                 {
-                  messageId: I[t.type]
+                  messageId: E[n.type]
                 }
               ) })
             ] }),
-            /* @__PURE__ */ a("span", { className: "font-medium", children: [
-              s(t.apy, o),
+            /* @__PURE__ */ t("span", { className: "font-medium", children: [
+              r(n.apy, a),
               "%"
             ] })
           ]
         },
-        `base-${t.type}-${t.apy}`
+        `base-${n.type}-${n.apy}`
       )),
-      d.map((t) => {
-        const m = y?.[t.rewardToken]?.symbol || t.rewardTokenSymbol;
-        return /* @__PURE__ */ a(
+      p.map((n) => {
+        const m = g?.[n.rewardToken]?.symbol || n.rewardTokenSymbol;
+        return /* @__PURE__ */ t(
           "div",
           {
             className: "flex justify-between items-start gap-4",
             children: [
-              /* @__PURE__ */ a("div", { className: "flex flex-col gap-0.5", children: [
-                /* @__PURE__ */ a("span", { className: " flex items-center gap-1.5", children: [
-                  /* @__PURE__ */ e(N, { symbol: m, size: 16 }),
+              /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5", children: [
+                /* @__PURE__ */ t("span", { className: " flex items-center gap-1.5", children: [
+                  /* @__PURE__ */ e(
+                    b,
+                    {
+                      symbol: v(m),
+                      size: 16
+                    }
+                  ),
                   /* @__PURE__ */ e(
-                    r,
+                    i,
                     {
                       messageId: "components.apyParts.extraAPY",
                       values: { symbol: m }
@@ -144,52 +134,39 @@ function D({
                   ),
                   ":"
                 ] }),
-                /* @__PURE__ */ e(g, { className: "text-xs", children: /* @__PURE__ */ e(r, { messageId: "components.apyParts.extraAPY.tip" }) })
+                /* @__PURE__ */ e(N, { className: "text-xs", children: /* @__PURE__ */ e(i, { messageId: "components.apyParts.extraAPY.tip" }) })
               ] }),
-              /* @__PURE__ */ a("span", { className: "font-medium text-green-500", children: [
+              /* @__PURE__ */ t("span", { className: "font-medium text-green-500", children: [
                 "+",
-                s(t.apy, o),
+                r(n.apy, a),
                 "%"
               ] })
             ]
           },
-          `extra-${t.rewardToken}-${t.apy}`
+          `extra-${n.rewardToken}-${n.apy}`
         );
       }),
-      /* @__PURE__ */ a("div", { className: "flex justify-between gap-4 pt-2 border-t border-border", children: [
-        /* @__PURE__ */ a("span", { className: "font-medium", children: [
-          /* @__PURE__ */ e(r, { messageId: "components.apyParts.totalAPY" }),
+      /* @__PURE__ */ t("div", { className: "flex justify-between gap-4 pt-2 border-t border-border", children: [
+        /* @__PURE__ */ t("span", { className: "font-medium", children: [
+          /* @__PURE__ */ e(i, { messageId: "components.apyParts.totalAPY" }),
           ":"
         ] }),
-        /* @__PURE__ */ a("span", { className: "font-bold", children: [
-          s(l, o),
+        /* @__PURE__ */ t("span", { className: "font-bold", children: [
+          r(s, a),
           "%"
         ] })
       ] }),
-      n?.tooltip && /* @__PURE__ */ a("div", { className: "flex items-start gap-2 pt-2 border-t border-border text-xs opacity-80", children: [
-        /* @__PURE__ */ a(
-          "svg",
-          {
-            className: "h-3.5 w-3.5 mt-0.5 flex-shrink-0",
-            fill: "currentColor",
-            viewBox: "0 0 20 20",
-            role: "img",
-            "aria-label": "External APY",
-            children: [
-              /* @__PURE__ */ e("title", { children: "External APY" }),
-              /* @__PURE__ */ e("path", { d: "M11 3a1 1 0 10-2 0v1a1 1 0 102 0V3zM15.657 5.757a1 1 0 00-1.414-1.414l-.707.707a1 1 0 001.414 1.414l.707-.707zM18 10a1 1 0 01-1 1h-1a1 1 0 110-2h1a1 1 0 011 1zM5.05 6.464A1 1 0 106.464 5.05l-.707-.707a1 1 0 00-1.414 1.414l.707.707zM5 10a1 1 0 01-1 1H3a1 1 0 110-2h1a1 1 0 011 1zM8 16v-1h4v1a2 2 0 11-4 0zM12 14c.015-.34.208-.646.477-.859a4 4 0 10-4.954 0c.27.213.462.519.476.859h4.002z" })
-            ]
-          }
-        ),
+      o?.tooltip && /* @__PURE__ */ t("div", { className: "flex items-start gap-2 pt-2 border-t border-border text-xs opacity-80", children: [
+        /* @__PURE__ */ e("span", { className: "mt-0.5 shrink-0 leading-none", children: /* @__PURE__ */ e(j, { size: 14 }) }),
         /* @__PURE__ */ e("div", { className: "font-medium", children: /* @__PURE__ */ e(
-          r,
+          i,
           {
-            messageId: n.tooltip,
+            messageId: o.tooltip,
             values: {
-              name: n.name,
-              value: /* @__PURE__ */ a("span", { className: "font-bold", children: [
+              name: o.name,
+              value: /* @__PURE__ */ t("span", { className: "font-bold", children: [
                 "+",
-                s(n.value, o),
+                r(o.value, a),
                 "%"
               ] })
             }
@@ -200,5 +177,5 @@ function D({
   ] }) });
 }
 export {
-  D as CompoundAPY
+  H as CompoundAPY
 };

package/dist/esm/components/confirm-menu/confirm-menu.js

@@ -1,25 +1,26 @@
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { X as m } from "lucide-react";
-import { IconButton as l } from "../icon-button/icon-button.js";
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { IconButton as m } from "../icon-button/icon-button.js";
+import { faXmark as n } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as s } from "../icons/fa-icon.js";
 import "react";
-import { cn as n } from "../../utils/cn.js";
-import "sonner";
 import "@gearbox-protocol/sdk";
-function u({ title: r, onClose: o, className: t }) {
-  return /* @__PURE__ */ i(
+import { cn as l } from "../../utils/cn.js";
+import "sonner";
+function b({ title: o, onClose: r, className: i }) {
+  return /* @__PURE__ */ t(
     "div",
     {
-      className: n("flex items-center justify-between w-full mb-4", t),
+      className: l("flex items-center justify-between w-full mb-4", i),
       children: [
-        /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-foreground", children: r }) }),
+        /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-foreground", children: o }) }),
         /* @__PURE__ */ e(
-          l,
+          m,
           {
             variant: "ghost",
             size: "sm",
-            onClick: o,
+            onClick: r,
             "aria-label": "Close",
-            children: /* @__PURE__ */ e(m, { className: "h-5 w-5" })
+            children: /* @__PURE__ */ e(s, { icon: n, className: "size-5" })
           }
         )
       ]
@@ -27,5 +28,5 @@ function u({ title: r, onClose: o, className: t }) {
   );
 }
 export {
-  u as ConfirmMenu
+  b as ConfirmMenu
 };

package/dist/esm/components/credit-session-status/credit-session-status.js

@@ -1,8 +1,8 @@
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import "react";
+import "@gearbox-protocol/sdk";
 import { cn as r } from "../../utils/cn.js";
 import "sonner";
-import "@gearbox-protocol/sdk";
 const o = {
   active: "bg-green-500",
   closed: "bg-gray-500",

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

@@ -1,17 +1,17 @@
-import { jsxs as g, jsx as n } from "react/jsx-runtime";
-import { ChevronDown as x } from "lucide-react";
+import { jsxs as x, jsx as n } from "react/jsx-runtime";
+import { IconExpand as g } from "@gearbox-protocol/static";
 import { TokenSymbol as b } from "../token-symbol/token-symbol.js";
 import "react";
+import "@gearbox-protocol/sdk";
 import { cn as i } from "../../utils/cn.js";
 import "sonner";
-import "@gearbox-protocol/sdk";
 const w = {
   old: { symbol: 16, arrow: 8 },
   sm: { symbol: 16, arrow: 8 },
   md: { symbol: 28, arrow: 12 },
   lg: { symbol: 32, arrow: 14 },
   default: { symbol: 28, arrow: 12 }
-}, C = {
+}, z = {
   old: "px-2 py-1 gap-1",
   sm: "px-2 py-1 gap-1",
   md: "px-3 py-1.5 gap-2",
@@ -24,15 +24,15 @@ function B({
   token: t,
   disabled: r,
   showSelectDialog: o,
-  size: e = "md",
-  active: s = !1,
+  size: s = "md",
+  active: e = !1,
   chainId: l,
   network: u,
   className: y,
   children: f
 }) {
-  const d = !r && o ? o : void 0, m = w[e], p = o && !r;
-  return /* @__PURE__ */ g(
+  const d = !r && o ? o : void 0, m = w[s], p = o && !r;
+  return /* @__PURE__ */ x(
     "button",
     {
       type: "button",
@@ -40,10 +40,10 @@ function B({
       disabled: r,
       className: i(
         "inline-flex items-center rounded-full bg-secondary font-medium transition-colors",
-        C[e],
+        z[s],
         p && "cursor-pointer hover:bg-secondary/80",
         !p && "cursor-default",
-        s && "ring-2 ring-primary ring-offset-1",
+        e && "ring-2 ring-primary ring-offset-1",
         r && "opacity-50 cursor-not-allowed",
         y
       ),
@@ -64,10 +64,10 @@ function B({
           {
             className: i(
               "flex items-center justify-center rounded transition-colors",
-              s && "bg-primary/10"
+              e && "bg-primary/10"
             ),
             children: /* @__PURE__ */ n(
-              x,
+              g,
               {
                 size: m.arrow,
                 className: "text-muted-foreground"

package/dist/esm/components/description/description.js

@@ -1,17 +1,23 @@
-import { jsx as o } from "react/jsx-runtime";
-import "react";
+import { jsx as p } from "react/jsx-runtime";
+import * as a from "react";
+import "@gearbox-protocol/sdk";
 import { cn as m } from "../../utils/cn.js";
 import "sonner";
-import "@gearbox-protocol/sdk";
-function c({ className: t, ...r }) {
-  return /* @__PURE__ */ o(
-    "span",
+import { Typography as c } from "../typography/typography.js";
+const e = a.forwardRef(
+  ({ className: r, as: o = "div", ...i }, t) => /* @__PURE__ */ p(
+    c,
     {
-      className: m("text-sm text-muted-foreground", t),
-      ...r
+      ref: t,
+      className: m(r),
+      variant: "caption",
+      color: "secondary",
+      as: o,
+      ...i
     }
-  );
-}
+  )
+);
+e.displayName = "Description";
 export {
-  c as Description
+  e as Description
 };

package/dist/esm/components/detailed-apy/detailed-apy.js

@@ -1,29 +1,30 @@
 import { jsx as n, Fragment as f, jsxs as r } from "react/jsx-runtime";
 import { Skeleton as y } from "../skeleton/skeleton.js";
 import "react";
+import "@gearbox-protocol/sdk";
 import { cn as c } from "../../utils/cn.js";
 import "sonner";
-import "@gearbox-protocol/sdk";
+import "../tooltip/simple-tooltip.js";
 import { TooltipProvider as x, Tooltip as N, TooltipTrigger as g, TooltipContent as b } from "../tooltip/tooltip.js";
-function S({
+function C({
   totalAPY: d,
   totalAPYLoading: p,
   baseAPY: l,
   extraAPY: a,
-  tokensList: t,
+  tokensList: i,
   children: m,
-  className: i
+  className: o
 }) {
   const h = l && l.length > 0 || a && a.length > 0;
   if (p)
-    return /* @__PURE__ */ n(y, { className: c("h-4 w-12", i) });
-  const o = m ?? /* @__PURE__ */ n("span", { className: c("tabular-nums", i), children: d !== void 0 ? `${d.toFixed(2)}%` : "N/A" });
+    return /* @__PURE__ */ n(y, { className: c("h-4 w-12", o) });
+  const s = m ?? /* @__PURE__ */ n("span", { className: c("tabular-nums", o), children: d !== void 0 ? `${d.toFixed(2)}%` : "N/A" });
   return h ? /* @__PURE__ */ n(x, { children: /* @__PURE__ */ r(N, { children: [
-    /* @__PURE__ */ n(g, { asChild: !0, children: /* @__PURE__ */ n("span", { className: "cursor-help underline decoration-dotted underline-offset-2", children: o }) }),
+    /* @__PURE__ */ n(g, { asChild: !0, children: /* @__PURE__ */ n("span", { className: "cursor-help underline decoration-dotted underline-offset-2", children: s }) }),
     /* @__PURE__ */ n(b, { className: "max-w-xs", children: /* @__PURE__ */ r("div", { className: "space-y-2 text-sm", children: [
       l && l.length > 0 && /* @__PURE__ */ r("div", { children: [
         /* @__PURE__ */ n("div", { className: "font-medium text-muted-foreground mb-1", children: "Base APY" }),
-        l.map((e, s) => /* @__PURE__ */ r(
+        l.map((e, t) => /* @__PURE__ */ r(
           "div",
           {
             className: "flex justify-between gap-4",
@@ -35,13 +36,13 @@ function S({
               ] })
             ]
           },
-          `base-${e.type || s}-${e.apy}`
+          `base-${e.type || t}-${e.apy}`
         ))
       ] }),
       a && a.length > 0 && /* @__PURE__ */ r("div", { children: [
         /* @__PURE__ */ n("div", { className: "font-medium text-muted-foreground mb-1", children: "Extra Rewards" }),
-        a.map((e, s) => {
-          const u = e.token && t ? t[e.token]?.symbol : e.token;
+        a.map((e, t) => {
+          const u = e.token && i ? i[e.token]?.symbol : e.token;
           return /* @__PURE__ */ r(
             "div",
             {
@@ -54,7 +55,7 @@ function S({
                 ] })
               ]
             },
-            `extra-${e.token || s}-${e.apy}`
+            `extra-${e.token || t}-${e.apy}`
           );
         })
       ] }),
@@ -66,8 +67,8 @@ function S({
         ] })
       ] })
     ] }) })
-  ] }) }) : /* @__PURE__ */ n(f, { children: o });
+  ] }) }) : /* @__PURE__ */ n(f, { children: s });
 }
 export {
-  S as DetailedApy
+  C as DetailedApy
 };

package/dist/esm/components/detailed-page-title/detailed-page-title.js

@@ -1,34 +1,36 @@
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { Check as g, Copy as y, ExternalLink as m } from "lucide-react";
+import { IconCopy as g, IconExternal as m } from "@gearbox-protocol/static";
 import * as p from "react";
 import { Button as d } from "../buttons/button/button.js";
-import { DropdownMenu as w, DropdownMenuTrigger as N } from "../dropdown-menu/dropdown-menu.js";
+import { DropdownMenu as y, DropdownMenuTrigger as z } from "../dropdown-menu/dropdown-menu.js";
 import "../dropdown-menu/dropdown-menu-checkbox-item.js";
-import { DropdownMenuContent as C } from "../dropdown-menu/dropdown-menu-content.js";
-import { DropdownMenuItem as x } from "../dropdown-menu/dropdown-menu-item.js";
+import { DropdownMenuContent as N } from "../dropdown-menu/dropdown-menu-content.js";
+import { DropdownMenuItem as C } from "../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 { faCheck as x } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as w } from "../icons/fa-icon.js";
 import { PageTitle as T } from "../page-title/page-title.js";
 import { TokenIcon as b } from "../token-icon/token-icon.js";
+import "@gearbox-protocol/sdk";
 import { cn as s } from "../../utils/cn.js";
 import "sonner";
-import "@gearbox-protocol/sdk";
-function H({
-  title: u,
-  token: l,
+function O({
+  title: f,
+  token: c,
   toCopy: i,
   explorerLinks: o,
-  className: f
+  className: u
 }) {
-  const [a, c] = p.useState(!1), n = p.useRef(null), h = async () => {
+  const [a, l] = p.useState(!1), n = p.useRef(null), h = async () => {
     if (i)
       try {
-        await navigator.clipboard.writeText(i), n.current && clearTimeout(n.current), c(!0), n.current = setTimeout(() => {
-          c(!1);
+        await navigator.clipboard.writeText(i), n.current && clearTimeout(n.current), l(!0), n.current = setTimeout(() => {
+          l(!1);
         }, 1500);
       } catch (t) {
         console.error("Failed to copy:", t);
@@ -37,7 +39,7 @@ function H({
   return /* @__PURE__ */ e(
     T,
     {
-      icon: l?.symbol && /* @__PURE__ */ e(b, { symbol: l.symbol, size: 36 }),
+      icon: c?.symbol && /* @__PURE__ */ e(b, { symbol: c.symbol, size: 36 }),
       actions: /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
         i && /* @__PURE__ */ r(
           d,
@@ -55,7 +57,7 @@ function H({
                     "absolute inset-0 flex items-center justify-center transition-all duration-200",
                     a ? "opacity-100 scale-100 text-green-500" : "opacity-0 scale-50 text-green-500"
                   ),
-                  children: /* @__PURE__ */ e(g, { className: "h-4 w-4" })
+                  children: /* @__PURE__ */ e(w, { icon: x, className: "size-4" })
                 }
               ),
               /* @__PURE__ */ e(
@@ -65,15 +67,15 @@ function H({
                     "flex items-center justify-center transition-all duration-200",
                     a ? "opacity-0 scale-50" : "opacity-100 scale-100"
                   ),
-                  children: /* @__PURE__ */ e(y, { className: "h-4 w-4" })
+                  children: /* @__PURE__ */ e(g, { size: 16, className: "size-4" })
                 }
               )
             ]
           }
         ),
-        o && o.length > 0 && /* @__PURE__ */ r(w, { children: [
-          /* @__PURE__ */ e(N, { asChild: !0, children: /* @__PURE__ */ e(d, { variant: "ghost", size: "icon", title: "View in explorer", children: /* @__PURE__ */ e(m, { className: "h-4 w-4" }) }) }),
-          /* @__PURE__ */ e(C, { align: "end", children: o.map((t) => /* @__PURE__ */ e(x, { asChild: !0, children: /* @__PURE__ */ r(
+        o && o.length > 0 && /* @__PURE__ */ r(y, { children: [
+          /* @__PURE__ */ e(z, { asChild: !0, children: /* @__PURE__ */ e(d, { variant: "ghost", size: "icon", title: "View in explorer", children: /* @__PURE__ */ e(m, { size: 16, className: "size-4" }) }) }),
+          /* @__PURE__ */ e(N, { align: "end", children: o.map((t) => /* @__PURE__ */ e(C, { asChild: !0, children: /* @__PURE__ */ r(
             "a",
             {
               href: t.url,
@@ -82,17 +84,17 @@ function H({
               className: "flex items-center gap-2",
               children: [
                 t.name,
-                /* @__PURE__ */ e(m, { className: "h-3 w-3 ml-auto" })
+                /* @__PURE__ */ e(m, { size: 12, className: "ml-auto size-3" })
               ]
             }
           ) }, t.url)) })
         ] })
       ] }),
-      className: s(f),
-      children: u
+      className: s(u),
+      children: f
     }
   );
 }
 export {
-  H as DetailedPageTitle
+  O as DetailedPageTitle
 };