@myarapat/plugin/dist/securili-widget.umd.js

Securili plugin for vendor sites

(function(a,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],t):(a=typeof globalThis<"u"?globalThis:a||self,t(a.SecuriliWidget={},a.jsxRuntime,a.React))})(this,(function(a,t,c){"use strict";const e={colors:{background:"#0D0D0D",panel:"#1C1C1E",primary:"#50c371",primaryHover:"#178636",text:{primary:"#FFFFFF",secondary:"rgba(255, 255, 255, 0.85)",tertiary:"rgba(255, 255, 255, 0.65)"},success:"#24B44E",error:"#FF4444",border:"rgba(255, 255, 255, 0.1)"},spacing:{sm:8,md:16,lg:24},widget:{maxWidth:"400px",padding:"32px",borderRadius:"16px",fontFamily:"-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",titleFontSize:"24px",subtitleFontSize:"14px",inputBorderRadius:"8px",boxShadow:"0 10px 25px rgba(0, 0, 0, 0.15), 0 4px 10px rgba(0, 0, 0, 0.1)"}},v=({vendor:g,vendorId:y,onSuccess:Y,apiBaseUrl:f,mode:L="Securili",userEmail:C,vendorToken:T})=>{const i=L==="twofactor",[p,W]=c.useState(()=>i&&C?C:""),[F,V]=c.useState(!1),[l,k]=c.useState(""),[h,n]=c.useState(""),[B,I]=c.useState(!1),[r,u]=c.useState(!1),$=async o=>{if(i)return;I(o==="signup"),n(""),u(!0);const s=o==="signup"?"/api/user-to-vendor-signup-request/":"/api/generate-otp-for-vendors/";try{const d=await fetch(`${f}${s}`,{method:"POST",headers:{"Content-Type":"application/json","X-Vendor-Id":y},body:JSON.stringify({email:p,vendor:g})}),M=await d.json();d.ok?(V(!0),n(o==="signup"?"✅ Signup OTP sent! Check your Securili portal.":"✅ Login OTP sent. Please enter it below.")):n(`❌ ${M.error||M.message}`)}catch{n("❌ Network error.")}finally{u(!1)}},O=async()=>{if(i)return;n(""),u(!0);const o=B?"/api/confirm-vendor-signup/":"/api/verify-login-otp/";try{const s=await fetch(`${f}${o}`,{method:"POST",headers:{"Content-Type":"application/json","X-Vendor-Id":y},body:JSON.stringify({email:p,vendor:g,otp:l})}),d=await s.json();s.ok&&d.redirect_url?(n(B?"✅ Signup complete! Redirecting...":"✅ Login successful! Redirecting..."),setTimeout(()=>window.location.href=d.redirect_url,500)):n(`❌ ${d.error||d.message}`)}catch{n("❌ OTP verification failed.")}finally{u(!1)}},P=async()=>{if(i){if(!T){n("❌ Vendor token missing");return}n(""),u(!0);try{const o=await fetch(`${f}/api/vendors/2fa/verify/`,{method:"POST",headers:{"Content-Type":"application/json","X-Vendor-Id":y},body:JSON.stringify({email:p,vendor:g,code:l,vendor_token:T})}),s=await o.json();o.ok&&s.redirect_url?window.location.href=s.redirect_url:n(`❌ ${s.error||s.message}`)}catch{n("❌ Verification failed.")}finally{u(!1)}}},D={backgroundColor:e.colors.panel,border:`1px solid ${e.colors.border}`,borderRadius:e.widget.borderRadius,boxShadow:e.widget.boxShadow,padding:e.widget.padding,width:"100%",maxWidth:e.widget.maxWidth,margin:"0 auto",fontFamily:e.widget.fontFamily},_={textAlign:"center",marginBottom:e.spacing.lg},A={fontSize:e.widget.titleFontSize,fontWeight:"bold",marginBottom:e.spacing.sm,color:e.colors.text.primary},q={color:e.colors.text.secondary,fontSize:e.widget.subtitleFontSize},H=o=>({padding:e.spacing.sm,borderRadius:e.widget.inputBorderRadius,marginBottom:e.spacing.md,fontSize:"14px",fontWeight:"500",border:`1px solid ${o?e.colors.success:e.colors.error}`,backgroundColor:o?`${e.colors.success}15`:`${e.colors.error}15`,color:o?e.colors.success:e.colors.error}),E={display:"block",fontSize:"14px",fontWeight:"500",marginBottom:e.spacing.sm,color:e.colors.text.primary},j={width:"100%",padding:e.spacing.sm,border:`1px solid ${e.colors.border}`,borderRadius:e.widget.inputBorderRadius,backgroundColor:e.colors.background,color:e.colors.text.primary,fontSize:"16px",transition:"all 0.2s ease",outline:"none"},z={...j,textAlign:"center",fontSize:"18px",fontFamily:"monospace",letterSpacing:"0.1em"},m={width:"100%",padding:`${e.spacing.sm}px 0`,backgroundColor:e.colors.primary,color:"white",fontWeight:"600",borderRadius:e.widget.inputBorderRadius,border:"none",fontSize:"16px",cursor:r?"not-allowed":"pointer",opacity:r?.6:1,transition:"all 0.2s ease"},N={width:"100%",padding:`${e.spacing.sm}px 0`,backgroundColor:"transparent",color:e.colors.primary,fontWeight:"600",borderRadius:e.widget.inputBorderRadius,border:`1px solid ${e.colors.primary}`,fontSize:"16px",cursor:r?"not-allowed":"pointer",opacity:r?.6:1,transition:"all 0.2s ease"},J={display:"flex",alignItems:"center",justifyContent:"center",padding:e.spacing.md,borderRadius:e.widget.inputBorderRadius,marginBottom:e.spacing.md,backgroundColor:`${e.colors.primary}10`,border:`1px solid ${e.colors.primary}30`},X={textAlign:"center",paddingTop:e.spacing.md,borderTop:`1px solid ${e.colors.border}`},K={fontSize:"12px",color:e.colors.text.tertiary},b=o=>{o.target.style.borderColor=e.colors.primary,o.target.style.boxShadow=`0 0 0 2px ${e.colors.primary}30`},S=o=>{o.target.style.borderColor=e.colors.border,o.target.style.boxShadow="none"},x=o=>{r||(o.currentTarget.style.backgroundColor=e.colors.primaryHover)},w=o=>{r||(o.currentTarget.style.backgroundColor=e.colors.primary)},G=o=>{r||(o.currentTarget.style.backgroundColor=`${e.colors.primary}15`)},Q=o=>{r||(o.currentTarget.style.backgroundColor="transparent")};return t.jsxs("div",{style:D,children:[t.jsxs("div",{style:_,children:[t.jsx("h2",{style:A,children:i?"🔒 Two-Factor Authentication":"Securili Login"}),!i&&t.jsx("p",{style:q,children:"Secure authentication powered by Securili"})]}),h&&t.jsx("div",{style:H(h.includes("✅")),children:h}),!i&&t.jsxs("div",{style:{marginBottom:e.spacing.md},children:[t.jsx("label",{style:E,children:"Email Address *"}),t.jsx("input",{type:"email",placeholder:"Enter your Securili email",value:p,onChange:o=>W(o.target.value),style:j,onFocus:b,onBlur:S,disabled:r})]}),!i&&!F&&t.jsxs("div",{style:{marginBottom:e.spacing.md},children:[t.jsx("button",{onClick:()=>$("login"),style:m,onMouseEnter:x,onMouseLeave:w,disabled:r||!p,children:r?"Processing...":"Login with Securili"}),t.jsx("button",{onClick:()=>$("signup"),style:{...N,marginTop:e.spacing.sm},onMouseEnter:G,onMouseLeave:Q,disabled:r||!p,children:r?"Processing...":"Signup with Securili"})]}),i&&t.jsxs("div",{style:{marginBottom:e.spacing.md},children:[t.jsx("div",{style:J,children:t.jsx("p",{style:{color:e.colors.text.primary,margin:0},children:"Enter your 6-digit authenticator code"})}),t.jsx("input",{type:"text",placeholder:"Enter 2FA code",value:l,onChange:o=>k(o.target.value.replace(/\D/g,"").slice(0,6)),style:z,onFocus:b,onBlur:S,onKeyDown:o=>{o.key==="Enter"&&l.length===6&&!r&&P()},disabled:r}),t.jsx("button",{onClick:P,style:{...m,marginTop:e.spacing.md},onMouseEnter:x,onMouseLeave:w,disabled:r||l.length!==6,children:r?"Verifying...":"Verify 2FA Code"})]}),F&&!i&&t.jsxs("div",{style:{marginBottom:e.spacing.md},children:[t.jsx("label",{style:E,children:"Enter OTP Code"}),t.jsx("input",{type:"text",placeholder:"Enter OTP",value:l,onChange:o=>k(o.target.value.replace(/\D/g,"").slice(0,6)),style:z,onFocus:b,onBlur:S,onKeyDown:o=>{o.key==="Enter"&&l&&!r&&O()},disabled:r}),t.jsx("button",{onClick:O,style:{...m,marginTop:e.spacing.md},onMouseEnter:x,onMouseLeave:w,disabled:r||!l,children:r?"Verifying...":"Confirm OTP"})]}),t.jsx("div",{style:X,children:t.jsxs("p",{style:K,children:["Powered by"," ",t.jsx("span",{style:{color:e.colors.primary},children:"Securili"})]})})]})};a.SecuriliWidget=v,a.default=v,Object.defineProperties(a,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));