@abaxx_tech/v-integration-react 1.1.0 → 1.1.1

package/README.md

@@ -16,9 +16,9 @@
 ## Installation
 Install the package via npm or yarn:
 ```sh
-npm install @abaxxtech/v-integration-react@1.1.0
+npm install @abaxx_tech/v-integration-react
 # or
-yarn add @abaxxtech/v-integration-react@1.1.0
+yarn add @abaxx_tech/v-integration-react
 ```
 <br/><br/>
 
@@ -26,7 +26,7 @@ yarn add @abaxxtech/v-integration-react@1.1.0
 ### 1. Wrap your app with `VerifierProvider`
 Wrap your application with `VerifierProvider` to manage authentication. The provider automatically handles PKCE generation, SSE connections, and token management through the `AuthService`.
 ```ts
-import { VerifierProvider } from "@abaxxtech/v-integration-react";
+import { VerifierProvider } from "@abaxx_tech/v-integration-react";
 
 const App = () => {
   return (
@@ -47,7 +47,7 @@ export default App;
 
 #### Complete Authentication UI (`VerifierAuth`)
 ```ts
-import { VerifierAuth } from "@abaxxtech/v-integration-react";
+import { VerifierAuth } from "@abaxx_tech/v-integration-react";
 import "v-integration-react/index.css";
 
 const LoginPage = () => {
@@ -59,7 +59,7 @@ export default LoginPage;
 
 #### QR Code Only (`VerifierAuthQr`)
 ```ts
-import { VerifierAuthQr } from "@abaxxtech/v-integration-react";
+import { VerifierAuthQr } from "@abaxx_tech/v-integration-react";
 import "v-integration-react/index.css";
 
 const QRLoginAuth = () => {
@@ -78,7 +78,7 @@ export default QRLoginAuth;
 
 #### Email Input Only (`VerifierAuthEmail`)
 ```ts
-import { VerifierAuthEmail } from "@abaxxtech/v-integration-react";
+import { VerifierAuthEmail } from "@abaxx_tech/v-integration-react";
 import "v-integration-react/index.css";
 
 const EmailLoginAuth = () => {
@@ -321,4 +321,4 @@ VITE_CLIENT_ID="your-client-id"
 3. Start development:
 ```sh
 npm run dev
-```
+```

package/dist/v-integration-react.css

@@ -0,0 +1 @@
+.v-auth-container *,.v-auth-container *:before,.v-auth-container *:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}.v-auth-container{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;line-height:1.5}.v-grid{display:grid}.v-grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.v-grid-responsive{grid-template-columns:1fr}@media (min-width: 768px){.v-grid-responsive{grid-template-columns:1fr 1fr}}.v-h-screen{height:100vh}.v-bg-white{background-color:#fff}.v-bg-left{display:none}@media (min-width: 768px){.v-bg-left{display:block}}.v-flex{display:flex}.v-flex-col{flex-direction:column}.v-items-center{align-items:center}.v-justify-center{justify-content:center}.v-gap-2{gap:.5rem}.v-relative{position:relative}.v-absolute{position:absolute}.v-hidden{display:none}@media (min-width: 768px){.v-hidden.md\:v-block{display:block}}.v-inset-0{top:0;right:0;bottom:0;left:0}.v-h-full{height:100%}.v-w-full{width:100%}.v-w-20{width:5rem}.v-h-20{height:5rem}.v-h-10{height:2.5rem}.v-h-4{height:1rem}.v-h-130{height:130px}.v-h-16{height:4rem}.v-w-4{width:1rem}.v-min-w-300{min-width:300px}.v-w-130{width:130px}.v-w-16{width:4rem}.v-p-3{padding:.75rem}.v-p-4{padding:1rem}.v-p-6{padding:1.5rem}.v-px-2{padding-left:.5rem;padding-right:.5rem}.v-px-4{padding-left:1rem;padding-right:1rem}.v-mb-3{margin-bottom:.75rem}.v-mb-4{margin-bottom:1rem}.v-mb-5{margin-bottom:1.25rem}.v-mb-6{margin-bottom:1.5rem}.v-mb-8{margin-bottom:2rem}.v-my-4{margin-top:1rem;margin-bottom:1rem}.v-text-center{text-align:center}.v-text-sm{font-size:.875rem;line-height:1.25rem}.v-text-base{font-size:1rem;line-height:1.5rem}.v-text-xl{font-size:1.25rem;line-height:1.75rem}.v-text-2xl{font-size:1.5rem;line-height:2rem}.v-font-medium{font-weight:500}.v-font-semibold{font-weight:600}.v-tracking-wide{letter-spacing:.025em}.v-text-black{color:#000}.v-text-white{color:#fff}.v-text-gray-400{color:#9ca3af}.v-text-gray-800{color:#1f2937}.v-text-green-700{color:#15803d}.v-text-green-800{color:#166534}.v-bg-green-100{background-color:#dcfce7}.v-bg-slate-100{background-color:#f1f5f9}.v-text-slate-800{color:#1e293b}.v-bg-transparent{background-color:transparent}.v-bg-red{background-color:#cf0000}.v-text-gray-600{color:#6b7280}.v-border{border-width:1px}.v-border-gray-400{border-color:#9ca3af}.v-rounded{border-radius:.25rem}.v-rounded-lg{border-radius:.5rem}.v-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.25rem;border:1px solid #9ca3af;background-color:transparent;padding:.5rem;text-align:center;color:#6b7280}.v-input:focus{outline:2px solid transparent;outline-offset:2px;border-color:#3b82f6}.v-input:disabled{opacity:.5;cursor:not-allowed}.v-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.25rem;padding:.5rem 1rem;font-weight:600;transition:all .2s;cursor:pointer;border:none;background-color:#cf0000;color:#fff}.v-button:hover{background-color:#b91c1c}.v-button:disabled{opacity:.5;cursor:not-allowed}.v-animate-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.v-fade-in{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.v-bg-cover{background-size:cover}.v-bg-no-repeat{background-repeat:no-repeat}.v-object-contain{object-fit:contain}.v-mix-blend-multiply{mix-blend-mode:multiply}.v-blur-sm{filter:blur(4px)}.v-fixed{position:fixed}.v-top-4{top:1rem}.v-right-4{right:1rem}

package/dist/v-integration-react.d.ts

@@ -0,0 +1,87 @@
+import { default as default_2 } from 'react';
+import { ReactNode } from 'react';
+
+declare type Props = {
+    appId: string | number;
+    clientId: string;
+    apiUrl: string;
+    children: ReactNode;
+};
+
+export declare const VContext: default_2.Context<VContextObj>;
+
+export declare type VContextObj = {
+    appId: string | number;
+    apiUrl: string;
+    clientId: string;
+    authRequestId: string;
+    setAuthRequestId: default_2.Dispatch<default_2.SetStateAction<string>>;
+    identity: string;
+    setIdentity: default_2.Dispatch<default_2.SetStateAction<string>>;
+    isAuthenticating: boolean;
+    setIsAuthenticating: default_2.Dispatch<default_2.SetStateAction<boolean>>;
+    codeVerifier: string;
+    setCodeVerifier: default_2.Dispatch<default_2.SetStateAction<string>>;
+    codeChallenge: string;
+    setCodeChallenge: default_2.Dispatch<default_2.SetStateAction<string>>;
+    authCode: string;
+    setAuthCode: default_2.Dispatch<default_2.SetStateAction<string>>;
+    authRequestIdExpires: Date;
+    setAuthRequestIdExpires: default_2.Dispatch<default_2.SetStateAction<Date>>;
+    token: string | null;
+    setToken: default_2.Dispatch<default_2.SetStateAction<string | null>>;
+    authError: string | null;
+    setAuthError: default_2.Dispatch<default_2.SetStateAction<string | null>>;
+};
+
+export declare const VContextProvider: default_2.FC<Props>;
+
+export declare const VerifierAuth: default_2.FC<VerifierAuthProps>;
+
+export declare const VerifierAuthEmail: default_2.FC<VerifierAuthEmailProps>;
+
+export declare interface VerifierAuthEmailProps {
+    inputPlaceholder?: string;
+    buttonText?: string;
+    inputHeight?: string;
+    inputWidth?: string;
+    inputTextColor?: string;
+    inputBorderColor?: string;
+    inputBackgroundColor?: string;
+    buttonHeight?: string;
+    buttonWidth?: string;
+    buttonBackgroundColor?: string;
+    buttonTextColor?: string;
+    containerClass?: string;
+    checkmarkColor?: string;
+}
+
+export declare interface VerifierAuthProps {
+    title: string;
+    containerClass?: string;
+}
+
+export declare const VerifierAuthQr: default_2.FC<VerifierAuthQrProps>;
+
+export declare interface VerifierAuthQrProps {
+    size?: number;
+    qrColor?: string;
+    logoImage?: string;
+    logoWidth?: number;
+    logoHeight?: number;
+    quietZone?: number;
+    containerClass?: string;
+    showStatus?: boolean;
+    checkmarkColor?: string;
+}
+
+export declare const VerifierProvider: default_2.FC<VerifierProviderProps>;
+
+export declare interface VerifierProviderProps {
+    appId: string | number;
+    clientId: string;
+    apiUrl: string;
+    children: ReactNode;
+}
+
+export { }