Components & Hooks

SessionWatchdog

Monitors user activity and triggers callbacks on idle.

<SessionWatchdog
  onIdle={() => logout()}
  onActive={() => console.log('User active')}
/>

Props

• onIdle - Called when user becomes idle
• onActive - Called when user becomes active again

AuditBoundary

React Error Boundary that reports crashes to your backend.

<AuditBoundary fallback={<ErrorPage />}>
  <YourComponent />
</AuditBoundary>

Props

• fallback - React node to show when error occurs

SecurityBanner

Displays warnings for insecure connections and outdated browsers.

<SecurityBanner
  config={{
    checkBrowserVersion: true,
    dismissible: true,
    position: 'top'
  }}
/>

useSecureStorage

Encrypted localStorage/sessionStorage with AES-GCM.

const { value, setValue, isLoading } = useSecureStorage('key', defaultValue);

// Data is encrypted before saving
setValue('sensitive data');

useSecureInput

Returns props to harden input fields against caching and clipboard.

const secureProps = useSecureInput({ type: 'password' });

<input {...secureProps} />

// Adds: autocomplete="off", onPaste blocked, etc.

useNis2Log

Manually report security events to your backend.

const { logInfo, logWarning, logCritical } = useNis2Log();

logWarning('SUSPICIOUS_ACTIVITY', { userId: 123 });