@jmruthers/pace-core 0.5.66 → 0.5.68

package/docs/api/modules.md

@@ -1,6 +1,6 @@
-[@jmruthers/pace-core - v0.5.66](README.md) / Exports
+[@jmruthers/pace-core - v0.5.68](README.md) / Exports
 
-# @jmruthers/pace-core - v0.5.66
+# @jmruthers/pace-core - v0.5.68
 
 **`File`**
 
@@ -73,6 +73,7 @@ import { Dialog, NavigationMenu } from '@jmruthers/pace-core/components';
 - [PublicPageFooterProps](interfaces/PublicPageFooterProps.md)
 - [PublicPageHeaderProps](interfaces/PublicPageHeaderProps.md)
 - [PublicPageLayoutProps](interfaces/PublicPageLayoutProps.md)
+- [SwitchProps](interfaces/SwitchProps.md)
 - [ToastProps](interfaces/ToastProps.md)
 - [ToastActionElement](interfaces/ToastActionElement.md)
 - [UserMenuProps](interfaces/UserMenuProps.md)
@@ -233,6 +234,7 @@ import { Dialog, NavigationMenu } from '@jmruthers/pace-core/components';
 - [SelectGroup](modules.md#selectgroup)
 - [SelectLabel](modules.md#selectlabel)
 - [SelectSeparator](modules.md#selectseparator)
+- [Switch](modules.md#switch)
 - [Table](modules.md#table)
 - [TableHeader](modules.md#tableheader)
 - [TableBody](modules.md#tablebody)
@@ -3035,6 +3037,38 @@ ___
 
 ___
 
+### Switch
+
+▸ **Switch**(`props`): `ReactNode`
+
+Switch component
+
+A toggle switch for boolean states. Built on Radix UI for accessibility.
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`SwitchProps`](interfaces/SwitchProps.md) & `RefAttributes`\<`HTMLButtonElement`\> |
+
+#### Returns
+
+`ReactNode`
+
+**`Component`**
+
+**`Example`**
+
+```tsx
+<Switch checked={isEnabled} onCheckedChange={setIsEnabled} />
+```
+
+#### Defined in
+
+[packages/core/src/components/Switch/Switch.tsx:97](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/components/Switch/Switch.tsx#L97)
+
+___
+
 ### Table
 
 ▸ **Table**(`props`): `ReactNode`
@@ -3636,7 +3670,7 @@ Useful for testing or when you need to force refresh all data
 
 #### Defined in
 
-[packages/core/src/hooks/public/usePublicEvent.ts:244](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/hooks/public/usePublicEvent.ts#L244)
+[packages/core/src/hooks/public/usePublicEvent.ts:391](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/hooks/public/usePublicEvent.ts#L391)
 
 ___
 
@@ -3657,7 +3691,7 @@ Get cache statistics for debugging
 
 #### Defined in
 
-[packages/core/src/hooks/public/usePublicEvent.ts:255](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/hooks/public/usePublicEvent.ts#L255)
+[packages/core/src/hooks/public/usePublicEvent.ts:402](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/hooks/public/usePublicEvent.ts#L402)
 
 ___
 

package/docs/api-reference/providers.md

@@ -18,10 +18,10 @@ interface UnifiedAuthProviderProps {
   enableRBAC?: boolean;
   onAuthStateChange?: (event: AuthChangeEvent, session: Session | null) => void;
   
-  // Inactivity auto-logout configuration
-  idleTimeoutMs?: number; // Default: 30 minutes
-  warnBeforeMs?: number; // Default: 60 seconds
-  onIdleLogout?: (reason: 'inactivity') => void; // App handles redirect/navigation
+  // Inactivity auto-logout configuration - MANDATORY for security
+  idleTimeoutMs: number; // REQUIRED: Inactivity timeout in milliseconds
+  warnBeforeMs: number; // REQUIRED: Warning time before logout in milliseconds
+  onIdleLogout: (reason: 'inactivity') => void; // REQUIRED: App handles redirect/navigation
   renderInactivityWarning?: (args: {
     timeRemaining: number;
     onStaySignedIn: () => void;
@@ -36,6 +36,7 @@ interface UnifiedAuthProviderProps {
 ```tsx
 import { UnifiedAuthProvider } from '@jmruthers/pace-core';
 import { createClient } from '@supabase/supabase-js';
+import { useNavigate } from 'react-router-dom';
 
 const supabase = createClient(
   process.env.NEXT_PUBLIC_SUPABASE_URL!,
@@ -43,12 +44,18 @@ const supabase = createClient(
 );
 
 function App() {
+  const navigate = useNavigate();
+
   return (
     <UnifiedAuthProvider 
       supabaseClient={supabase} 
       appName="my-app"
       enableRBAC={true}
       requireOrganisationContext={true}
+      // Required inactivity configuration
+      idleTimeoutMs={30 * 60 * 1000}  // 30 minutes
+      warnBeforeMs={5 * 60 * 1000}    // 5 minutes warning
+      onIdleLogout={() => navigate('/login')}
     >
       <AppContent />
     </UnifiedAuthProvider>
@@ -66,9 +73,9 @@ function App() {
 | `requireOrganisationContext` | `boolean` | `true` | Require organisation context for security |
 | `enableRBAC` | `boolean` | `false` | Enable the RBAC system |
 | `onAuthStateChange` | `function` | `undefined` | Callback for auth state changes |
-| `idleTimeoutMs` | `number` | `1800000` | Inactivity timeout in milliseconds (30 minutes) |
-| `warnBeforeMs` | `number` | `60000` | Warning time before logout in milliseconds (60 seconds) |
-| `onIdleLogout` | `function` | `undefined` | Callback when user is logged out due to inactivity |
+| `idleTimeoutMs` | `number` | **Required** | Inactivity timeout in milliseconds (e.g., `30 * 60 * 1000` for 30 minutes) |
+| `warnBeforeMs` | `number` | **Required** | Warning time before logout in milliseconds (e.g., `5 * 60 * 1000` for 5 minutes) |
+| `onIdleLogout` | `function` | **Required** | Callback when user is logged out due to inactivity |
 | `renderInactivityWarning` | `function` | `undefined` | Custom warning UI renderer |
 | `dangerouslyDisableInactivity` | `boolean` | `false` | Dev-only: disable inactivity feature (not allowed in production) |
 
@@ -76,6 +83,8 @@ function App() {
 
 The `UnifiedAuthProvider` includes built-in inactivity tracking that automatically logs out users after a period of inactivity for security purposes.
 
+> **⚠️ Breaking Change**: As of version 0.5.65+, the inactivity timeout configuration (`idleTimeoutMs`, `warnBeforeMs`, `onIdleLogout`) is **mandatory** to prevent apps from accidentally bypassing auto-logout security features.
+
 #### Features
 
 - **Automatic logout** after 30 minutes of inactivity (configurable)

package/docs/migration-guides/unified-auth-provider-mandatory-timeouts.md

@@ -0,0 +1,226 @@
+# UnifiedAuthProvider Mandatory Timeouts Migration Guide
+
+> **Version**: 0.5.65+  
+> **Breaking Change**: Yes  
+> **Migration Required**: Yes
+
+## Overview
+
+As of version 0.5.65, the `UnifiedAuthProvider` now requires mandatory inactivity timeout configuration to prevent apps from accidentally bypassing auto-logout security features.
+
+## What Changed
+
+The following props are now **required** (previously optional):
+
+- `idleTimeoutMs` - Inactivity timeout in milliseconds
+- `warnBeforeMs` - Warning time before logout in milliseconds  
+- `onIdleLogout` - Callback when user is logged out due to inactivity
+
+## Migration Steps
+
+### 1. Update Your UnifiedAuthProvider
+
+**Before (❌ Will now cause TypeScript errors):**
+
+```tsx
+import { UnifiedAuthProvider } from '@jmruthers/pace-core';
+
+function App() {
+  return (
+    <UnifiedAuthProvider
+      supabaseClient={supabase}
+      appName="my-app"
+      enableRBAC={true}
+    >
+      <AppContent />
+    </UnifiedAuthProvider>
+  );
+}
+```
+
+**After (✅ Required configuration):**
+
+```tsx
+import { UnifiedAuthProvider } from '@jmruthers/pace-core';
+import { useNavigate } from 'react-router-dom';
+
+function App() {
+  const navigate = useNavigate();
+
+  return (
+    <UnifiedAuthProvider
+      supabaseClient={supabase}
+      appName="my-app"
+      enableRBAC={true}
+      // Required inactivity configuration
+      idleTimeoutMs={30 * 60 * 1000}  // 30 minutes
+      warnBeforeMs={5 * 60 * 1000}    // 5 minutes warning
+      onIdleLogout={() => navigate('/login')}
+    >
+      <AppContent />
+    </UnifiedAuthProvider>
+  );
+}
+```
+
+### 2. Choose Appropriate Timeouts
+
+Select timeouts based on your security requirements:
+
+#### High Security (Sensitive Data)
+```tsx
+idleTimeoutMs={15 * 60 * 1000}  // 15 minutes
+warnBeforeMs={2 * 60 * 1000}    // 2 minutes warning
+```
+
+#### Standard Security (Most Apps)
+```tsx
+idleTimeoutMs={30 * 60 * 1000}  // 30 minutes
+warnBeforeMs={5 * 60 * 1000}    // 5 minutes warning
+```
+
+#### User-Friendly (Low Security Risk)
+```tsx
+idleTimeoutMs={60 * 60 * 1000}  // 1 hour
+warnBeforeMs={10 * 60 * 1000}   // 10 minutes warning
+```
+
+### 3. Handle the Logout Callback
+
+The `onIdleLogout` callback is called when the user is logged out due to inactivity. Implement appropriate navigation:
+
+#### React Router
+```tsx
+import { useNavigate } from 'react-router-dom';
+
+function App() {
+  const navigate = useNavigate();
+
+  return (
+    <UnifiedAuthProvider
+      // ... other props
+      onIdleLogout={() => {
+        console.log('User logged out due to inactivity');
+        navigate('/login', { replace: true });
+      }}
+    >
+      <AppContent />
+    </UnifiedAuthProvider>
+  );
+}
+```
+
+#### Next.js Router
+```tsx
+import { useRouter } from 'next/router';
+
+function App() {
+  const router = useRouter();
+
+  return (
+    <UnifiedAuthProvider
+      // ... other props
+      onIdleLogout={() => {
+        console.log('User logged out due to inactivity');
+        router.push('/login');
+      }}
+    >
+      <AppContent />
+    </UnifiedAuthProvider>
+  );
+}
+```
+
+#### Window Location (Fallback)
+```tsx
+<UnifiedAuthProvider
+  // ... other props
+  onIdleLogout={() => {
+    console.log('User logged out due to inactivity');
+    window.location.href = '/login';
+  }}
+>
+  <AppContent />
+</UnifiedAuthProvider>
+```
+
+### 4. Optional: Custom Warning UI
+
+You can provide a custom inactivity warning modal:
+
+```tsx
+<UnifiedAuthProvider
+  // ... other props
+  renderInactivityWarning={({ timeRemaining, onStaySignedIn, onSignOutNow }) => (
+    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
+      <div className="bg-white p-6 rounded-lg shadow-lg max-w-md">
+        <h3 className="text-lg font-semibold mb-4">Session Timeout Warning</h3>
+        <p className="mb-4">
+          You will be signed out in {Math.ceil(timeRemaining / 1000)} seconds due to inactivity.
+        </p>
+        <div className="flex gap-2">
+          <button 
+            onClick={onStaySignedIn}
+            className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
+          >
+            Stay Signed In
+          </button>
+          <button 
+            onClick={onSignOutNow}
+            className="px-4 py-2 bg-gray-500 text-white rounded hover:bg-gray-600"
+          >
+            Sign Out Now
+          </button>
+        </div>
+      </div>
+    </div>
+  )}
+>
+  <AppContent />
+</UnifiedAuthProvider>
+```
+
+## Why This Change Was Made
+
+1. **Security**: Prevents apps from accidentally bypassing auto-logout
+2. **Explicit Configuration**: Forces developers to consciously choose timeout values
+3. **Compliance**: Ensures security requirements are met by default
+4. **Consistency**: All apps using pace-core will have proper session management
+
+## Testing Your Migration
+
+After updating your code:
+
+1. **Login to your app**
+2. **Wait for the warning** (should appear before the timeout)
+3. **Don't interact with the app** for the full timeout period
+4. **Verify you're logged out** and redirected to login
+
+## Rollback (Not Recommended)
+
+If you need to temporarily disable inactivity tracking (development only):
+
+```tsx
+<UnifiedAuthProvider
+  // ... other props
+  dangerouslyDisableInactivity={true} // Dev-only, not allowed in production
+>
+  <AppContent />
+</UnifiedAuthProvider>
+```
+
+> **⚠️ Warning**: `dangerouslyDisableInactivity` is automatically disabled in production builds for security.
+
+## Support
+
+If you encounter issues during migration:
+
+1. Check the [API Reference](../api-reference/providers.md) for complete documentation
+2. Review the [Security Guide](../security/README.md) for best practices
+3. Ensure all required props are provided with appropriate values
+
+## Related Documentation
+
+- [UnifiedAuthProvider API Reference](../api-reference/providers.md)
+- [Security Best Practices](../security/README.md)
+- [Inactivity Tracking Guide](../implementation-guides/inactivity-tracking.md)

package/docs/security/README.md

@@ -84,17 +84,21 @@ PACE Core includes built-in inactivity tracking for enhanced security:
 
 ```tsx
 import { UnifiedAuthProvider } from '@jmruthers/pace-core';
+import { useNavigate } from 'react-router-dom';
 
 function App() {
+  const navigate = useNavigate();
+
   return (
     <UnifiedAuthProvider
       supabaseClient={supabaseClient}
       appName="my-app"
+      // Required inactivity configuration for security
       idleTimeoutMs={30 * 60 * 1000} // 30 minutes
       warnBeforeMs={60 * 1000}       // 60 seconds warning
       onIdleLogout={() => {
         // Handle redirect to login page
-        window.location.href = '/login';
+        navigate('/login', { replace: true });
       }}
     >
       <YourApp />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jmruthers/pace-core",
-  "version": "0.5.66",
+  "version": "0.5.68",
   "description": "Clean, modern React component library with Tailwind v4 styling and native utilities",
   "private": false,
   "publishConfig": {
@@ -179,6 +179,7 @@
     "@radix-ui/react-label": "^2.0.0",
     "@radix-ui/react-progress": "^1.0.0",
     "@radix-ui/react-slot": "^1.0.0",
+    "@radix-ui/react-switch": "^1.1.0",
     "@radix-ui/react-toast": "^1.0.0",
     "@radix-ui/react-tooltip": "^1.0.0",
     "@tanstack/react-table": "^8.0.0",