@privy-io/react-auth/dist/esm/TransactionDetails-DqFIa7IO.mjs

React client for the Privy Auth API

import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import{styled as n}from"styled-components";import{P as r,H as l,W as o}from"./WalletLink-DNbGmOPX.mjs";import{g as d}from"./ethers-Dnv1tMN3.mjs";import{F as a}from"./Layouts-BlFm53ED.mjs";import c from"@heroicons/react/24/outline/ChevronDownIcon";import{createContext as s,useState as h,useContext as p}from"react";import{s as v,u}from"./context-DLtU3JQy.mjs";const g=({label:t,children:n,valueStyles:r})=>/*#__PURE__*/e(f,{children:[/*#__PURE__*/i("div",{children:t}),/*#__PURE__*/i(m,{style:{...r},children:n})]});let f=n.div`
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;

  > :first-child {
    color: var(--privy-color-foreground-3);
    text-align: left;
  }

  > :last-child {
    color: var(--privy-color-foreground-2);
    text-align: right;
  }
`,m=n.div`
  font-size: 14px;
  line-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--privy-border-radius-full);
  background-color: var(--privy-color-background-2);
  padding: 4px 8px;
`;const x=({gas:t,tokenPrice:n,tokenSymbol:l})=>/*#__PURE__*/e(a,{style:{paddingBottom:"12px"},children:[/*#__PURE__*/e(b,{children:[/*#__PURE__*/i(k,{children:"Est. Fees"}),/*#__PURE__*/i("div",{children:/*#__PURE__*/i(r,{weiQuantities:[BigInt(t)],tokenPrice:n,tokenSymbol:l})})]}),n&&/*#__PURE__*/i(w,{children:`${d(BigInt(t),l)}`})]}),y=({value:t,gas:n,tokenPrice:l,tokenSymbol:o})=>{let c=BigInt(t??0)+BigInt(n);/*#__PURE__*/return e(a,{children:[/*#__PURE__*/e(b,{children:[/*#__PURE__*/i(k,{children:"Total (including fees)"}),/*#__PURE__*/i("div",{children:/*#__PURE__*/i(r,{weiQuantities:[BigInt(t||0),BigInt(n)],tokenPrice:l,tokenSymbol:o})})]}),l&&/*#__PURE__*/i(w,{children:d(c,o)})]})};let b=n.div`
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 4px;
`,w=n.div`
  display: flex;
  flex-direction: row;
  height: 12px;

  font-size: 12px;
  line-height: 12px;
  color: var(--privy-color-foreground-3);
  font-weight: 400;
`,k=n.div`
  font-size: 14px;
  line-height: 22.4px;
  font-weight: 400;
`;const P=/*#__PURE__*/s(void 0),I=/*#__PURE__*/s(void 0),S=({defaultValue:e,children:t})=>{let[n,r]=h(e||null);/*#__PURE__*/return i(P.Provider,{value:{activePanel:n,togglePanel:e=>{r(n===e?null:e)}},children:/*#__PURE__*/i(z,{children:t})})},j=({value:e,children:t})=>{let{activePanel:n,togglePanel:r}=p(P),l=n===e;/*#__PURE__*/return i(I.Provider,{value:{onToggle:()=>r(e),value:e},children:/*#__PURE__*/i(C,{isActive:l?"true":"false","data-open":String(l),children:t})})},B=({children:n})=>{let{activePanel:r}=p(P),{onToggle:l,value:o}=p(I),d=r===o;/*#__PURE__*/
return e(t,{children:[/*#__PURE__*/e(F,{onClick:l,"data-open":String(d),children:[/*#__PURE__*/i(W,{children:n}),/*#__PURE__*/i(V,{isactive:d?"true":"false",children:/*#__PURE__*/i(c,{height:"16px",width:"16px",strokeWidth:"2"})})]}),/*#__PURE__*/i(Q,{})]})},T=({children:e})=>{let{activePanel:t}=p(P),{value:n}=p(I);/*#__PURE__*/return i(D,{"data-open":String(t===n),children:/*#__PURE__*/i(L,{children:e})})},A=({children:e})=>{let{activePanel:t}=p(P),{value:n}=p(I);/*#__PURE__*/return i(L,{children:"function"==typeof e?e({isActive:t===n}):e})};let z=n.div`
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 8px;
`,F=n.div`
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  cursor: pointer;
  padding-bottom: 8px;
`,Q=n.div`
  width: 100%;

  && {
    border-top: 1px solid;
    border-color: var(--privy-color-foreground-4);
  }
  padding-bottom: 12px;
`,W=n.div`
  font-size: 14px;
  font-weight: 500;
  line-height: 19.6px;
  width: 100%;
  padding-right: 8px;
`,C=n.div`
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  padding: 12px;

  && {
    border: 1px solid;
    border-color: var(--privy-color-foreground-4);
    border-radius: var(--privy-border-radius-md);
  }
`,D=n.div`
  position: relative;
  overflow: hidden;
  transition: max-height 25ms ease-out;

  &[data-open='true'] {
    max-height: 700px;
  }

  &[data-open='false'] {
    max-height: 0;
  }
`,L=n.div`
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1 1 auto;
  min-height: 1px;
`,V=n.div`
  transform: ${e=>"true"===e.isactive?"rotate(180deg)":"rotate(0deg)"};
`;const $=({from:t,to:n,txn:r,transactionInfo:d,tokenPrice:a,gas:c,tokenSymbol:s})=>{let h=BigInt(r?.value||0);/*#__PURE__*/
return i(S,{...u().render.standalone?{defaultValue:"details"}:{},children:/*#__PURE__*/e(j,{value:"details",children:[/*#__PURE__*/i(B,{children:/*#__PURE__*/e(E,{children:[/*#__PURE__*/i("div",{children:d?.title||"Details"}),/*#__PURE__*/i(H,{children:/*#__PURE__*/i(l,{weiQuantities:[h],tokenPrice:a,tokenSymbol:s})})]})}),/*#__PURE__*/e(T,{children:[/*#__PURE__*/i(g,{label:"From",children:/*#__PURE__*/i(o,{walletAddress:t,chainId:r.chainId||v,chainType:"ethereum"})}),/*#__PURE__*/i(g,{label:"To",children:/*#__PURE__*/i(o,{walletAddress:n,chainId:r.chainId||v,chainType:"ethereum"})}),d&&d.action&&/*#__PURE__*/i(g,{label:"Action",children:d.action}),c&&/*#__PURE__*/i(x,{value:r.value,gas:c,tokenPrice:a,tokenSymbol:s})]}),/*#__PURE__*/i(A,{children:({isActive:e})=>/*#__PURE__*/i(y,{value:r.value,displayFee:e,gas:c||"0x0",tokenPrice:a,tokenSymbol:s})})]})})};let E=n.div`
  display: flex;
  flex-direction: row;
  justify-content: space-between;
`,H=n.div`
  flex-shrink: 0;
  padding-left: 8px;
`;export{$ as T};