UNPKG

@frank-auth/react

Version:

Flexible and customizable React UI components for Frank Authentication

4 lines (3 loc) 3.25 kB
'use client'; "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime");require("@emotion/styled");const T=require("../../ui/button/button.cjs"),f=require("../../ui/modal/modal.cjs"),X=require("@heroicons/react/24/outline"),n=require("react"),A=require("../../../hooks/use-config.cjs"),F=require("./sign-in-form.cjs"),G=a=>a&&a.__esModule?a:{default:a},J=G(n);function Q({isOpen:a=!1,onClose:e,modalSize:l="md",closeOnBackdropClick:c=!0,closeOnEscape:u=!0,modalClassName:r="",showCloseButton:g=!0,methods:j=["password","oauth","magic-link"],email:p,organizationId:M,redirectUrl:i,onSuccess:d,onError:z,title:m,subtitle:x,size:y="md",showBranding:I=!0,disabled:t=!1,showSignUpLink:S=!0,showForgotPasswordLink:b=!0,footer:q,header:v,backdrop:h="blur",placement:w="center",modalHeader:D,modalFooter:N,hideHeader:o=!1,hideFooter:_=!1,scrollBehavior:P="inside"}){const{components:$}=A.useConfig(),k=$.SignInModal;if(k)return s.jsx(k,{isOpen:a,onClose:e,modalSize:l,closeOnBackdropClick:c,closeOnEscape:u,modalClassName:r,showCloseButton:g,methods:j,email:p,organizationId:M,redirectUrl:i,onSuccess:d,onError:z,title:m,subtitle:x,size:y,showBranding:I,disabled:t,showSignUpLink:S,showForgotPasswordLink:b,footer:q,header:v,backdrop:h,placement:w,modalHeader:D,modalFooter:N,hideHeader:o,hideFooter:_,scrollBehavior:P});const K=n.useCallback(O=>{d?.(O),i||e?.()},[d,e,i]),R=n.useCallback(()=>{t||e?.()},[e,t]),C=(()=>{switch(l){case"sm":return{size:"sm",className:"max-w-sm"};case"md":return{size:"md",className:"max-w-md"};case"lg":return{size:"lg",className:"max-w-lg"};case"xl":return{size:"xl",className:"max-w-xl"};case"full":return{size:"full",className:"max-w-full"};default:return{size:"md",className:"max-w-md"}}})();return s.jsx(f.Modal,{isOpen:a,onClose:R,size:C.size,backdrop:h,placement:w,scrollBehavior:P,closeButton:g,isDismissable:c&&!t,isKeyboardDismissDisabled:!u||t,className:`${r}`,classNames:{wrapper:"z-[9999]",backdrop:"z-[9998]",base:`${C.className}`},children:s.jsxs(s.Fragment,{children:[!o&&s.jsx(f.ModalHeader,{className:"flex flex-col gap-1 px-6 py-4",children:D||s.jsxs("div",{className:"flex items-center justify-between w-full",children:[s.jsxs("div",{children:[m&&s.jsx("h2",{className:"text-lg font-semibold text-foreground",children:m}),x&&s.jsx("p",{className:"text-sm text-default-500 mt-1",children:x})]}),g&&s.jsx(T.Button,{isIconOnly:!0,variant:"light",size:"sm",onPress:R,className:"text-default-400 hover:text-default-600",isDisabled:t,children:s.jsx(X.XMarkIcon,{className:"w-4 h-4"})})]})}),s.jsx(f.ModalBody,{className:"px-6 py-4",children:s.jsx(F.SignInForm,{methods:j,email:p,organizationId:M,redirectUrl:i,onSuccess:K,onError:z,title:o?m:void 0,subtitle:o?x:void 0,size:y,showBranding:I,disabled:t,showSignUpLink:S,showForgotPasswordLink:b,header:v,footer:q,variant:"minimal",className:"space-y-4"})}),!_&&N&&s.jsx(f.ModalFooter,{className:"px-6 py-4",children:N})]})})}function V(){const[a,e]=J.default.useState(!1),l=n.useCallback(()=>e(!0),[]),c=n.useCallback(()=>e(!1),[]),u=n.useCallback(()=>e(r=>!r),[]);return{isOpen:a,open:l,close:c,toggle:u,setIsOpen:e}}exports.SignInModal=Q;exports.useSignInModal=V; //# sourceMappingURL=sign-in-modal.cjs.map