@privy-io/react-auth
Version:
React client for the Privy Auth API
3 lines (2 loc) • 8 kB
JavaScript
import{jsx as r,jsxs as o,Fragment as e}from"react/jsx-runtime";import{styled as a,css as l}from"styled-components";import{G as d}from"./useActiveWallet-Bsy5GTCV.mjs";const c=({variant:o="primary",size:e="lg",children:a,success:l,...d})=>{switch(o){case"secondary":/*#__PURE__*/return r(b,{size:e,...d,children:a});case"error":/*#__PURE__*/return r(b,{$warn:!0,size:e,...d,children:a});case"muted":/*#__PURE__*/return r(p,{size:e,...d,children:a});default:/*#__PURE__*/return r(n,{size:e,success:l,...d,children:a})}},i=/*#__PURE__*/a.button.withConfig({displayName:"BaseButton",componentId:"sc-e537b447-0"})(["display:flex;flex-direction:row;align-items:center;justify-content:center;user-select:none;&{width:auto;cursor:pointer;border-radius:",";font-size:14px;font-style:normal;font-weight:500;line-height:22px;letter-spacing:-0.016px;}&&{height:",";padding:0 ",";}"],(({$size:r})=>"sm"===r?"6px":"var(--privy-border-radius-sm)"),(({$size:r})=>"sm"===r?"28px":"48px"),(({$size:r})=>"sm"===r?"10px":"16px")),n=({children:a,loading:l,disabled:c,success:i,size:n="lg",loadingText:t="Loading...",as:s,onClick:b,...p})=>{let u="a"===s,y=!(!l&&!c);/*#__PURE__*/return r(v,{as:s,disabled:u?void 0:y,"aria-disabled":u?y:void 0,$success:i,$size:n,onClick:r=>{u&&y?r.preventDefault():b?.(r)},...p,children:l?/*#__PURE__*/o(e,{children:[/*#__PURE__*/r(d,{}),t?/*#__PURE__*/r("span",{style:{marginLeft:"8px"},children:t}):null]}):a})},t=({children:o,loading:e,disabled:a,...l})=>/*#__PURE__*/r(s,{disabled:a,...l,children:e?/*#__PURE__*/r(d,{color:"var(--privy-color-foreground-accent)"}):o});let s=/*#__PURE__*/a(i).withConfig({displayName:"StyledPrimaryButtonWithoutGray",componentId:"sc-e537b447-1"})(["position:relative;&&{background-color:var(--privy-color-accent);color:var(--privy-color-foreground-accent);transition:background-color 200ms ease;}&:hover{background-color:var(--privy-color-accent-dark);}&:active{background-color:var(--privy-color-accent-dark);}&:disabled,&:hover:disabled,&:active:disabled{cursor:not-allowed;color:var(--privy-color-foreground-disabled);background-color:var(--privy-color-accent-dark);}"]),v=/*#__PURE__*/a(i).withConfig({displayName:"StyledPrimaryButton",componentId:"sc-e537b447-2"})(["position:relative;&&{background-color:",";color:var(--privy-color-foreground-accent);transition:background-color 200ms ease;}&:hover{background-color:",";}&:active{background-color:",";}&:focus{outline:none;box-shadow:0 0 0 3px #949df9;}&:disabled{background-color:var(--privy-color-background-2);border:1px solid var(--privy-color-border-default);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}&:hover:disabled,&:active:disabled{background-color:var(--privy-color-background-2);border:1px solid var(--privy-color-border-default);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}",""],(r=>r.$warn?"var(--privy-color-error-dark)":"var(--privy-color-accent)"),(r=>r.$warn?"var(--privy-color-error-dark)":"var(--privy-color-accent-dark)"),(r=>r.$warn?"var(--privy-color-error-dark)":"var(--privy-color-accent-dark)"),(r=>r.disabled&&/*#__PURE__*/l(["&&&,&&&:hover,&&&:active{background-color:var(--privy-color-background-2);border:1px solid var(--privy-color-border-default);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}"])));const b=({children:a,loading:l,disabled:c,size:i="lg",loadingText:n="Loading...",as:t,onClick:s,...v})=>{let b="a"===t,p=!(!l&&!c);/*#__PURE__*/return r(u,{as:t,disabled:b?void 0:p,"aria-disabled":b?p:void 0,$size:i,onClick:r=>{b&&p?r.preventDefault():s?.(r)},...v,children:l?/*#__PURE__*/o(e,{children:[/*#__PURE__*/r(d,{}),n?/*#__PURE__*/r("span",{style:{marginLeft:"8px"},children:n}):null]}):a})},p=({children:a,loading:l,disabled:c,size:i="lg",loadingText:n="Loading...",as:t,onClick:s,...v})=>{let b="a"===t,p=!(!l&&!c);/*#__PURE__*/return r(y,{as:t,disabled:b?void 0:p,"aria-disabled":b?p:void 0,$size:i,onClick:r=>{b&&p?r.preventDefault():s?.(r)},...v,children:l?/*#__PURE__*/o(e,{children:[/*#__PURE__*/r(d,{}),n?/*#__PURE__*/r("span",{style:{marginLeft:"8px"},children:n}):null]}):a})};let u=/*#__PURE__*/a(i).withConfig({displayName:"StyledSecondaryButton",componentId:"sc-e537b447-3"})(["&&{border-width:1px;border-style:solid;border-color:",";background-color:var(--privy-color-background);color:",";transition:border-color 200ms ease,color 200ms ease,background-color 200ms ease;}&:hover{border-color:",";background-color:",";color:",";}&:active{border-color:",";background-color:",";color:",";}&:disabled{border-color:var(--privy-color-border-default);background-color:var(--privy-color-background-2);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}&:hover:disabled,&:active:disabled{border-color:var(--privy-color-border-default);background-color:var(--privy-color-background-2);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}",""],(r=>r.$warn?"var(--privy-color-border-error)":"var(--privy-color-accent)"),(r=>r.$warn?"var(--privy-color-error-dark)":"var(--privy-color-accent)"),(r=>r.$warn?"var(--privy-color-border-error)":"var(--privy-color-border-interactive-hover)"),(r=>r.$warn?"var(--privy-color-error-light)":"var(--privy-color-info-bg-hover)"),(r=>r.$warn?"var(--privy-color-error-dark)":"var(--privy-color-accent)"),(r=>r.$warn?"var(--privy-color-border-error)":"var(--privy-color-border-interactive)"),(r=>r.$warn?"var(--privy-color-error-bg-hover)":"var(--privy-color-info-bg)"),(r=>r.$warn?"var(--privy-color-error-dark)":"var(--privy-color-accent)"),(r=>r.disabled&&/*#__PURE__*/l(["&&&,&&&:hover,&&&:active{border-color:var(--privy-color-border-default);background-color:var(--privy-color-background-2);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}"]))),y=/*#__PURE__*/a(i).withConfig({displayName:"StyledMutedButton",componentId:"sc-e537b447-4"})(["&&{border-width:1px;border-style:solid;border-color:var(--privy-color-border-default);background-color:transparent;color:var(--privy-color-text-muted);transition:border-color 200ms ease,color 200ms ease,background-color 200ms ease;}&:hover{border-color:var(--privy-color-border-default);background-color:var(--privy-color-info-bg-hover);color:var(--privy-color-foreground-2);}&:active{border-color:var(--privy-color-border-default);background-color:var(--privy-color-info-bg);color:var(--privy-color-foreground-2);}&:focus{outline:none;box-shadow:0 0 0 3px #949df9;}&:disabled{border-color:var(--privy-color-border-default);background-color:var(--privy-color-background-2);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}&:hover:disabled,&:active:disabled{border-color:var(--privy-color-border-default);background-color:var(--privy-color-background-2);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}",""],(r=>r.disabled&&/*#__PURE__*/l(["&&&,&&&:hover,&&&:active{border-color:var(--privy-color-border-default);background-color:var(--privy-color-background-2);color:var(--privy-color-foreground-disabled);cursor:not-allowed;}"])));const g=({children:e,onClick:a,disabled:l,isSubmitting:c,...i})=>/*#__PURE__*/o(f,{$isSubmitting:c,onClick:a,disabled:l,...i,children:[/*#__PURE__*/r("span",{children:e}),
/*#__PURE__*/r("span",{children:/*#__PURE__*/r(d,{})})]});let f=/*#__PURE__*/a.button.withConfig({displayName:"StyledEmbeddedButton",componentId:"sc-e537b447-7"})(["&&{color:var(--privy-color-accent);font-size:16px;font-style:normal;font-weight:500;line-height:24px;cursor:pointer;border-radius:0px var(--privy-border-radius-mdlg) var(--privy-border-radius-mdlg) 0px;border:none;transition:color 200ms ease;@media (min-width:441px){font-size:14px;}:hover{color:var(--privy-color-accent-dark);}&& > :first-child{opacity:",";}&& > :last-child{position:absolute;display:flex;top:50%;left:50%;transform:translate3d(-50%,-50%,0);opacity:",";}:disabled,:hover:disabled{color:var(--privy-color-foreground-disabled);cursor:not-allowed;}}"],(r=>r.$isSubmitting?0:1),(r=>r.$isSubmitting?1:0));export{c as B,g as E,n as P,b as S,t as a};