@hyperbridge/ui 0.0.17 → 0.0.18

package/dist/index.d.mts

@@ -508,51 +508,61 @@ declare function ScrollAwareSeparator(props: React__default.ComponentProps<"div"
 }): react_jsx_runtime.JSX.Element;
 
 declare function Summary(props: {
-    children: React.ReactNode;
+    children: React__default.ReactNode;
 }): react_jsx_runtime.JSX.Element;
 type SummaryEntryItem = {
     name: string;
     icon: ({ size }: {
         size: string | number;
-    }) => React.ReactNode;
-    children: React.ReactNode;
+    }) => React__default.ReactNode;
+    children: React__default.ReactNode;
+    tooltip?: React__default.ReactNode | string;
 };
-declare function makeEntry({ name, icon, }: Pick<SummaryEntryItem, "name" | "icon">): ({ children }: {
-    children: React.ReactNode;
+declare function makeEntry({ name, icon, tooltip, }: Pick<SummaryEntryItem, "name" | "icon" | "tooltip">): ({ children, tooltip: overwriteTooltip, }: {
+    tooltip: SummaryEntryItem["tooltip"];
+    children: React__default.ReactNode;
 }) => react_jsx_runtime.JSX.Element;
 declare const SummaryValues: {
     Key: {
-        Bridge: ({ children }: {
-            children: React.ReactNode;
+        Bridge: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        GasEntry: ({ children }: {
-            children: React.ReactNode;
+        GasEntry: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        Rate: ({ children }: {
-            children: React.ReactNode;
+        Rate: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        SpillageTolerance: ({ children }: {
-            children: React.ReactNode;
+        SpillageTolerance: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        Route: ({ children }: {
-            children: React.ReactNode;
+        Route: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        ETA: ({ children }: {
-            children: React.ReactNode;
+        ETA: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        RecipientAddress: ({ children }: {
-            children: React.ReactNode;
+        RecipientAddress: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
-        Fee: ({ children }: {
-            children: React.ReactNode;
+        Fee: ({ children, tooltip: overwriteTooltip, }: {
+            tooltip: SummaryEntryItem["tooltip"];
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
     };
     Values: {
         Highlight: ({ children }: {
-            children: React.ReactNode;
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
         Soft: ({ children }: {
-            children: React.ReactNode;
+            children: React__default.ReactNode;
         }) => react_jsx_runtime.JSX.Element;
     };
 };

package/dist/index.mjs

@@ -3131,58 +3131,133 @@ function WalletManagerUIContent({
 }
 
 // src/components/molecules/summary.tsx
+import { InfoIcon } from "lucide-react";
+
+// src/@/ui/tooltip.tsx
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import { jsx as jsx33, jsxs as jsxs23 } from "react/jsx-runtime";
+function TooltipProvider(_a) {
+  var _b = _a, {
+    delayDuration = 0
+  } = _b, props = __objRest(_b, [
+    "delayDuration"
+  ]);
+  return /* @__PURE__ */ jsx33(
+    TooltipPrimitive.Provider,
+    __spreadValues({
+      "data-slot": "tooltip-provider",
+      delayDuration
+    }, props)
+  );
+}
+function Tooltip(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ jsx33(TooltipProvider, { children: /* @__PURE__ */ jsx33(TooltipPrimitive.Root, __spreadValues({ "data-slot": "tooltip" }, props)) });
+}
+function TooltipTrigger(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ jsx33(TooltipPrimitive.Trigger, __spreadValues({ "data-slot": "tooltip-trigger" }, props));
+}
+function TooltipContent(_a) {
+  var _b = _a, {
+    className,
+    sideOffset = 0,
+    children
+  } = _b, props = __objRest(_b, [
+    "className",
+    "sideOffset",
+    "children"
+  ]);
+  return /* @__PURE__ */ jsx33(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs23(
+    TooltipPrimitive.Content,
+    __spreadProps(__spreadValues({
+      "data-slot": "tooltip-content",
+      sideOffset,
+      className: cn(
+        "bg-brand-black-600 text-brand-black-100 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
+        className
+      )
+    }, props), {
+      children: [
+        children,
+        /* @__PURE__ */ jsx33(TooltipPrimitive.Arrow, { className: "bg-brand-black-600 fill-brand-black-600 z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+      ]
+    })
+  ) });
+}
+
+// src/components/molecules/summary.tsx
+import { jsx as jsx34, jsxs as jsxs24 } from "react/jsx-runtime";
 function Summary(props) {
-  return /* @__PURE__ */ jsx33("div", { className: "flex flex-col gap-2 text-brand-black-100", children: props.children });
+  return /* @__PURE__ */ jsx34("div", { className: "flex flex-col gap-2 text-brand-black-100", children: props.children });
 }
 function SummaryEntry(props) {
+  var _a;
   const Icon = props.icon;
-  return /* @__PURE__ */ jsxs23("div", { className: "flex select-none items-center text-[calc(12rem/16)] font-medium", children: [
-    /* @__PURE__ */ jsxs23("dt", { className: "flex-1 gap-1 flex items-center", children: [
-      /* @__PURE__ */ jsx33(Icon, { size: "1.16em" }),
-      /* @__PURE__ */ jsx33("span", { className: "text-[1em] leading-[1rem]", children: props.name })
+  const tooltip = typeof props.tooltip === "string" ? /* @__PURE__ */ jsxs24(Tooltip, { children: [
+    /* @__PURE__ */ jsx34(TooltipTrigger, { children: /* @__PURE__ */ jsx34(InfoIcon, { size: "1em" }) }),
+    /* @__PURE__ */ jsx34(TooltipContent, { children: props.tooltip })
+  ] }) : (_a = props.tooltip) != null ? _a : null;
+  return /* @__PURE__ */ jsxs24("div", { className: "flex select-none items-center text-[calc(12rem/16)] font-medium", children: [
+    /* @__PURE__ */ jsxs24("dt", { className: "flex-1 gap-1 flex items-center", children: [
+      /* @__PURE__ */ jsx34(Icon, { size: "1.16em" }),
+      /* @__PURE__ */ jsx34("span", { className: "text-[1em] leading-[1rem]", children: props.name }),
+      tooltip
     ] }),
-    /* @__PURE__ */ jsx33("dd", { children: props.children })
+    /* @__PURE__ */ jsx34("dd", { children: props.children })
   ] });
 }
 function makeEntry({
   name,
-  icon
+  icon,
+  tooltip
 }) {
-  return function Entry({ children }) {
-    return /* @__PURE__ */ jsx33(SummaryEntry, { icon, name, children }, name);
+  return function Entry({
+    children,
+    tooltip: overwriteTooltip
+  }) {
+    return /* @__PURE__ */ jsx34(
+      SummaryEntry,
+      {
+        icon,
+        name,
+        tooltip: overwriteTooltip || tooltip,
+        children
+      },
+      name
+    );
   };
 }
 var Bridge = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(Percent_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(Percent_default, { width: size }),
   name: "Bridge fee"
 });
 var RecipientAddress = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(Wallet_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(Wallet_default, { width: size }),
   name: "Recipient Address"
 });
 var GasEntry = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(Gas_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(Gas_default, { width: size }),
   name: "Gas costs"
 });
 var SpillageTolerance = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(ArrowBottomTop_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(ArrowBottomTop_default, { width: size }),
   name: "Spillage tolerance"
 });
 var Route = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(ArrowSplit_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(ArrowSplit_default, { width: size }),
   name: "Route"
 });
 var Rate = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(ArrowBottomTop_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(ArrowBottomTop_default, { width: size }),
   name: "Rate"
 });
 var Fee = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(Gas_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(Gas_default, { width: size }),
   name: "Fee"
 });
 var ETA = makeEntry({
-  icon: ({ size }) => /* @__PURE__ */ jsx33(Clock_default, { width: size }),
+  icon: ({ size }) => /* @__PURE__ */ jsx34(Clock_default, { width: size }),
   name: "Estimated time"
 });
 var SummaryValues = {
@@ -3198,10 +3273,10 @@ var SummaryValues = {
   },
   Values: {
     Highlight: ({ children }) => {
-      return /* @__PURE__ */ jsx33("span", { className: "text-[inherit] text-brand-white-500", children });
+      return /* @__PURE__ */ jsx34("span", { className: "text-[inherit] text-brand-white-500", children });
     },
     Soft: ({ children }) => {
-      return /* @__PURE__ */ jsx33("span", { className: "text-[inherit]text-brand-black-50", children });
+      return /* @__PURE__ */ jsx34("span", { className: "text-[inherit]text-brand-black-50", children });
     }
   }
 };
@@ -3214,7 +3289,7 @@ import React13 from "react";
 
 // src/@/ui/progress.tsx
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { jsx as jsx34 } from "react/jsx-runtime";
+import { jsx as jsx35 } from "react/jsx-runtime";
 function Progress(_a) {
   var _b = _a, {
     className,
@@ -3223,7 +3298,7 @@ function Progress(_a) {
     "className",
     "value"
   ]);
-  return /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsx35(
     ProgressPrimitive.Root,
     __spreadProps(__spreadValues({
       "data-slot": "progress",
@@ -3232,7 +3307,7 @@ function Progress(_a) {
         className
       )
     }, props), {
-      children: /* @__PURE__ */ jsx34(
+      children: /* @__PURE__ */ jsx35(
         ProgressPrimitive.Indicator,
         {
           "data-slot": "progress-indicator",
@@ -3244,59 +3319,6 @@ function Progress(_a) {
   );
 }
 
-// src/@/ui/tooltip.tsx
-import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
-function TooltipProvider(_a) {
-  var _b = _a, {
-    delayDuration = 0
-  } = _b, props = __objRest(_b, [
-    "delayDuration"
-  ]);
-  return /* @__PURE__ */ jsx35(
-    TooltipPrimitive.Provider,
-    __spreadValues({
-      "data-slot": "tooltip-provider",
-      delayDuration
-    }, props)
-  );
-}
-function Tooltip(_a) {
-  var props = __objRest(_a, []);
-  return /* @__PURE__ */ jsx35(TooltipProvider, { children: /* @__PURE__ */ jsx35(TooltipPrimitive.Root, __spreadValues({ "data-slot": "tooltip" }, props)) });
-}
-function TooltipTrigger(_a) {
-  var props = __objRest(_a, []);
-  return /* @__PURE__ */ jsx35(TooltipPrimitive.Trigger, __spreadValues({ "data-slot": "tooltip-trigger" }, props));
-}
-function TooltipContent(_a) {
-  var _b = _a, {
-    className,
-    sideOffset = 0,
-    children
-  } = _b, props = __objRest(_b, [
-    "className",
-    "sideOffset",
-    "children"
-  ]);
-  return /* @__PURE__ */ jsx35(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs24(
-    TooltipPrimitive.Content,
-    __spreadProps(__spreadValues({
-      "data-slot": "tooltip-content",
-      sideOffset,
-      className: cn(
-        "bg-brand-black-600 text-brand-black-100 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
-        className
-      )
-    }, props), {
-      children: [
-        children,
-        /* @__PURE__ */ jsx35(TooltipPrimitive.Arrow, { className: "bg-brand-black-600 fill-brand-black-600 z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
-      ]
-    })
-  ) });
-}
-
 // src/components/molecules/timeline.tsx
 import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
 var StatusTextMap = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperbridge/ui",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "sideEffects": false,
   "license": "MIT",
   "private": false,
@@ -33,8 +33,8 @@
     "typescript": "5.8.3",
     "vite": "^6.3.4",
     "vitest": "^3.1.2",
-    "@repo/eslint-config": "0.0.0",
-    "@repo/typescript-config": "0.0.0"
+    "@repo/typescript-config": "0.0.0",
+    "@repo/eslint-config": "0.0.0"
   },
   "dependencies": {
     "@radix-ui/react-dialog": "^1.1.14",