@acl-identity/react 0.1.0 → 0.1.1

package/.turbo/turbo-build.log

@@ -1,82 +1,82 @@
-
-> @acl-identity/react@0.1.0 build /Users/lanreyusuf/Developer/personal/acl-identity-sdk/packages/react
-> tsup
-
-▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
-
-    package.json:13:6:
-      13 │       "types": "./dist/index.d.ts"
-         ╵       ~~~~~~~
-
-  The "import" condition comes earlier and will be used for all "import" statements:
-
-    package.json:11:6:
-      11 │       "import": "./dist/index.js",
-         ╵       ~~~~~~~~
-
-  The "require" condition comes earlier and will be used for all "require" calls:
-
-    package.json:12:6:
-      12 │       "require": "./dist/index.cjs",
-         ╵       ~~~~~~~~~
-
-CLI Building entry: {"index":"src/index.ts"}
-CLI Using tsconfig: tsconfig.json
-CLI tsup v8.5.1
-CLI Using tsup config: /Users/lanreyusuf/Developer/personal/acl-identity-sdk/packages/react/tsup.config.ts
-CLI Target: es2020
-CLI Cleaning output folder
-ESM Build start
-CJS Build start
-
- WARN  ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json] 7:52:29 PM
-
-    package.json:13:6:
-      13 │       "types": "./dist/index.d.ts"
-         ╵       ~~~~~~~
-
-  The "import" condition comes earlier and will be used for all "import" statements:
-
-    package.json:11:6:
-      11 │       "import": "./dist/index.js",
-         ╵       ~~~~~~~~
-
-  The "require" condition comes earlier and will be used for all "require" calls:
-
-    package.json:12:6:
-      12 │       "require": "./dist/index.cjs",
-         ╵       ~~~~~~~~~
-
-
-
-
- WARN  ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json] 7:52:29 PM
-
-    package.json:13:6:
-      13 │       "types": "./dist/index.d.ts"
-         ╵       ~~~~~~~
-
-  The "import" condition comes earlier and will be used for all "import" statements:
-
-    package.json:11:6:
-      11 │       "import": "./dist/index.js",
-         ╵       ~~~~~~~~
-
-  The "require" condition comes earlier and will be used for all "require" calls:
-
-    package.json:12:6:
-      12 │       "require": "./dist/index.cjs",
-         ╵       ~~~~~~~~~
-
-
-
-ESM dist/index.mjs     7.33 KB
-ESM dist/index.mjs.map 18.09 KB
-ESM ⚡️ Build success in 78ms
-CJS dist/index.js     8.65 KB
-CJS dist/index.js.map 17.71 KB
-CJS ⚡️ Build success in 85ms
-DTS Build start
-DTS ⚡️ Build success in 440ms
-DTS dist/index.d.mts 4.58 KB
-DTS dist/index.d.ts  4.58 KB
+
+> @acl-identity/react@0.1.1 build /Users/lanreyusuf/Developer/personal/acl-identity-sdk/packages/react
+> tsup
+
+▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:13:6:
+      13 │       "types": "./dist/index.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:11:6:
+      11 │       "import": "./dist/index.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:12:6:
+      12 │       "require": "./dist/index.cjs",
+         ╵       ~~~~~~~~~
+
+CLI Building entry: {"index":"src/index.ts"}
+CLI Using tsconfig: tsconfig.json
+CLI tsup v8.5.1
+CLI Using tsup config: /Users/lanreyusuf/Developer/personal/acl-identity-sdk/packages/react/tsup.config.ts
+CLI Target: es2020
+CLI Cleaning output folder
+ESM Build start
+CJS Build start
+
+ WARN  ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:13:6:
+      13 │       "types": "./dist/index.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:11:6:
+      11 │       "import": "./dist/index.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:12:6:
+      12 │       "require": "./dist/index.cjs",
+         ╵       ~~~~~~~~~
+
+
+
+
+ WARN  ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:13:6:
+      13 │       "types": "./dist/index.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:11:6:
+      11 │       "import": "./dist/index.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:12:6:
+      12 │       "require": "./dist/index.cjs",
+         ╵       ~~~~~~~~~
+
+
+
+ESM dist/index.mjs     7.33 KB
+ESM dist/index.mjs.map 18.09 KB
+ESM ⚡️ Build success in 59ms
+CJS dist/index.js     8.65 KB
+CJS dist/index.js.map 17.71 KB
+CJS ⚡️ Build success in 59ms
+DTS Build start
+DTS ⚡️ Build success in 407ms
+DTS dist/index.d.mts 4.58 KB
+DTS dist/index.d.ts  4.58 KB

package/README.md

@@ -0,0 +1,126 @@
+# @acl-identity/react
+
+React integration for the ACL Identity SDK. Provides `AuthProvider`, the `useAuth` hook, and ready-made components for sign-in, sign-out, and OAuth2 callback handling.
+
+## Installation
+
+```bash
+npm install @acl-identity/react
+# or
+pnpm add @acl-identity/react
+```
+
+Requires React 18 or later as a peer dependency.
+
+## Quick start
+
+### 1. Create the client and wrap your app
+
+```tsx
+import { ACLBrowserClient, AuthProvider } from '@acl-identity/react';
+
+const client = new ACLBrowserClient({
+  baseUrl: 'https://auth.example.com',
+  clientId: 'my-client-id',
+  redirectUri: 'https://app.example.com/callback',
+  orgSlug: 'my-org',
+});
+
+function App() {
+  return (
+    <AuthProvider
+      client={client}
+      clientId="my-client-id"
+      redirectUri="https://app.example.com/callback"
+      orgSlug="my-org"
+      onRedirectCallback={(appState) => {
+        // navigate to appState?.returnTo after login
+      }}
+    >
+      <YourApp />
+    </AuthProvider>
+  );
+}
+```
+
+### 2. Use the `useAuth` hook
+
+```tsx
+import { useAuth } from '@acl-identity/react';
+
+function Header() {
+  const { user, isAuthenticated, isLoading, signIn, signOut } = useAuth();
+
+  if (isLoading) return <Spinner />;
+
+  if (!isAuthenticated) {
+    return <button onClick={() => signIn()}>Sign in</button>;
+  }
+
+  return (
+    <div>
+      <span>Welcome, {user?.name}</span>
+      <button onClick={() => signOut()}>Sign out</button>
+    </div>
+  );
+}
+```
+
+### 3. Handle the OAuth2 callback
+
+Add a callback page that renders `<CallbackHandler />`:
+
+```tsx
+import { CallbackHandler } from '@acl-identity/react';
+import { useNavigate } from 'react-router-dom';
+
+export function CallbackPage() {
+  const navigate = useNavigate();
+  return (
+    <CallbackHandler
+      onSuccess={() => navigate('/')}
+      onError={(err) => console.error(err)}
+    />
+  );
+}
+```
+
+## Components
+
+| Component | Description |
+|---|---|
+| `AuthProvider` | Context provider — wraps your app |
+| `CallbackHandler` | Processes the OAuth2 redirect callback |
+| `SignInButton` | Pre-wired sign-in button |
+| `SignOutButton` | Pre-wired sign-out button |
+| `SilentCallbackPage` | Placed at `silentRedirectUri` for iframe-based silent renewal |
+
+## Silent token renewal
+
+Mount `<SilentCallbackPage />` at a dedicated route (e.g. `/silent-callback`) and pass its URL to `AuthProvider`:
+
+```tsx
+<AuthProvider
+  ...
+  silentRedirectUri="https://app.example.com/silent-callback"
+>
+```
+
+Tokens are renewed automatically before they expire without a visible redirect.
+
+## `useAuth` return value
+
+| Field | Type | Description |
+|---|---|---|
+| `user` | `UserClaims \| null` | Decoded JWT claims of the current user |
+| `isAuthenticated` | `boolean` | Whether a valid token exists |
+| `isLoading` | `boolean` | True while the initial session check is in progress |
+| `error` | `Error \| null` | Last auth error |
+| `signIn(options?)` | `Promise<void>` | Redirects to the authorization server |
+| `signOut(options?)` | `Promise<void>` | Clears tokens and optionally revokes them |
+| `getAccessToken()` | `Promise<string \| null>` | Returns the current access token |
+| `handleCallback(url?)` | `Promise<{ appState? }>` | Manually processes a callback URL |
+
+## License
+
+MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acl-identity/react",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "React hooks and provider for ACL Identity — Phase 2",
   "license": "MIT",
   "main": "./dist/index.cjs",
@@ -18,9 +18,9 @@
     "react-dom": ">=18.0.0"
   },
   "dependencies": {
-    "@acl-identity/types": "0.1.0",
-    "@acl-identity/core": "0.1.0",
-    "@acl-identity/browser": "0.1.0"
+    "@acl-identity/types": "0.1.1",
+    "@acl-identity/browser": "0.1.1",
+    "@acl-identity/core": "0.1.1"
   },
   "devDependencies": {
     "@types/react": "^18.3.3",