@hyperbridge/ui 0.0.8 → 0.0.10

package/dist/index.d.mts

@@ -632,6 +632,7 @@ declare function TxListItemProcessing(props: ItemProps & {
 }): react_jsx_runtime.JSX.Element;
 type TxListItemProps = ItemProps & {
     completedAt: string;
+    mode: "send" | "rollback";
 } & React__default.ComponentPropsWithRef<"button">;
 declare const TxListItem: (props: TxListItemProps) => react_jsx_runtime.JSX.Element;
 declare function TxList({ children }: {

package/dist/index.mjs

@@ -685,7 +685,7 @@ function SwapForm({
                         className: "border-none ring-0 focus-visible:ring-0 focus-visible:ring-offset-0 text-[48px] leading-[1.2] h-[58px] p-0 text-white placeholder:text-brand-black-100 [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none disabled:opacity-50 !rounded-none"
                       }
                     ),
-                    /* @__PURE__ */ jsx10("div", { className: "w-[170px] pl-3 py-[13px]", children: /* @__PURE__ */ jsx10(
+                    /* @__PURE__ */ jsx10("div", { className: "w-[170px] pl-0 py-[13px]", children: /* @__PURE__ */ jsx10(
                       SwapTokenButton,
                       {
                         network: sender.token.network,
@@ -805,7 +805,7 @@ function SwapForm({
                         className: "border-none ring-0 focus-visible:ring-0 focus-visible:ring-offset-0 text-[48px] leading-[1.2] h-[58px] p-0 text-white placeholder:text-brand-black-100 [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none disabled:opacity-50 !rounded-none"
                       }
                     ),
-                    /* @__PURE__ */ jsx10("div", { className: "w-[170px] pl-3 py-[13px]", children: /* @__PURE__ */ jsx10(
+                    /* @__PURE__ */ jsx10("div", { className: "w-[170px] pl-0 py-[13px]", children: /* @__PURE__ */ jsx10(
                       SwapTokenButton,
                       {
                         network: receiver.token.network,
@@ -1151,7 +1151,7 @@ function DrawerContent(_a) {
         )
       }, props), {
         children: [
-          /* @__PURE__ */ jsx14("div", { className: "bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
+          /* @__PURE__ */ jsx14("div", { className: "bg-brand-black-350 mx-auto my-2 hidden h-[5px] w-16 shrink-0 rounded-[2.5px] group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
           children
         ]
       })
@@ -3565,7 +3565,7 @@ function TxListItemProcessing(props) {
         }
       ),
       /* @__PURE__ */ jsxs26("div", { className: "flex flex-grow flex-col text-start", children: [
-        /* @__PURE__ */ jsx37("span", { className: "text-brand-white-500 text-[0.875rem] h-[1.25rem]", children: props.caption }),
+        /* @__PURE__ */ jsx37("span", { className: "text-brand-white-500 whitespace-nowrap text-[0.875rem] h-[1.25rem]", children: props.caption }),
         /* @__PURE__ */ jsxs26(StatusBadge, { variant: props.status === "failed" ? "error" : "none", children: [
           "~ ",
           props.eta
@@ -3618,7 +3618,7 @@ function TxListItemProcessing(props) {
   ] }) });
 }
 var TxListItem = function TxListItem2(props) {
-  const _a = props, { caption, completedAt, from, to, amount } = _a, rest = __objRest(_a, ["caption", "completedAt", "from", "to", "amount"]);
+  const _a = props, { caption, completedAt, mode, from, to, amount } = _a, rest = __objRest(_a, ["caption", "completedAt", "mode", "from", "to", "amount"]);
   return /* @__PURE__ */ jsx37(
     "button",
     __spreadProps(__spreadValues({}, rest), {
@@ -3629,9 +3629,9 @@ var TxListItem = function TxListItem2(props) {
       ),
       children: /* @__PURE__ */ jsxs26("div", { className: "flex gap-[1rem] flex-1 z-20 text-brand-black-100 font-medium", children: [
         /* @__PURE__ */ jsx37(TokenTransferPair, { fromToken: from, toToken: to, size: "2rem" }),
-        /* @__PURE__ */ jsxs26("div", { className: "flex flex-grow flex-col text-start", children: [
+        /* @__PURE__ */ jsxs26("div", { className: "flex flex-grow flex-col text-start whitespace-nowrap", children: [
           /* @__PURE__ */ jsx37("span", { className: "text-brand-white-500 text-[0.875rem] h-[1.25rem]", children: caption }),
-          /* @__PURE__ */ jsx37(StatusBadge, { variant: "success" })
+          /* @__PURE__ */ jsx37(StatusBadge, { variant: mode === "rollback" ? "refunded" : "success" })
         ] }),
         /* @__PURE__ */ jsxs26("div", { className: "shrink-0 flex flex-col text-end", children: [
           /* @__PURE__ */ jsx37("span", { className: "text-base text-brand-white-500 h-[1.25rem]", children: amount }),
@@ -3651,6 +3651,10 @@ function StatusBadge({
       " ",
       /* @__PURE__ */ jsx37("span", { children: "Success" })
     ] }) : null,
+    variant === "refunded" ? /* @__PURE__ */ jsxs26(Fragment9, { children: [
+      /* @__PURE__ */ jsx37(StepBack_default, { strokeWidth: 2, width: "0.75rem", height: "0.75rem" }),
+      /* @__PURE__ */ jsx37("span", { children: "Refunded" })
+    ] }) : null,
     variant === "error" ? /* @__PURE__ */ jsxs26(Fragment9, { children: [
       /* @__PURE__ */ jsx37(
         Alert_default,
@@ -4602,6 +4606,7 @@ function HBDrawerContent(_a) {
     "children"
   ]);
   return /* @__PURE__ */ jsxs33(Fragment12, { children: [
+    /* @__PURE__ */ jsx47(HBDrawerPortal, {}),
     /* @__PURE__ */ jsx47(HBDrawerOverlay, {}),
     /* @__PURE__ */ jsxs33(
       DrawerPrimitive2.Content,
@@ -4750,7 +4755,7 @@ function CWDrawerContent(_a) {
   ]);
   const isMobile = useIsMobile();
   if (isMobile) {
-    return /* @__PURE__ */ jsx48(HBDrawer, { open: true, children: /* @__PURE__ */ jsx48(HBDrawerContent, { className: "bg-brand-black-550 rounded-t-[1rem] w-full px-[1rem] !max-h-[95vh] h-full border-t border-brand-black-300", children: /* @__PURE__ */ jsx48("div", { className: "flex flex-col", children }) }) });
+    return /* @__PURE__ */ jsx48(HBDrawerContent, { className: "bg-brand-black-550 rounded-t-[1rem] w-full px-[1rem] border-t border-brand-black-300 min-h-[90dvh]", children: /* @__PURE__ */ jsx48("div", { className: "flex flex-col", children }) });
   }
   return /* @__PURE__ */ jsx48(
     SheetContent,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperbridge/ui",
-  "version": "0.0.8",
+  "version": "0.0.10",
   "sideEffects": false,
   "license": "MIT",
   "private": false,