@micha.bigler/ui-core-micha 2.4.5 → 2.6.1

package/src/components/UserListComponent.jsx

@@ -10,8 +10,15 @@ import {
   CircularProgress,
   Alert,
   TextField,
+  Table,
+  TableBody,
+  TableCell,
+  TableContainer,
+  TableHead,
+  TableRow,
+  TableSortLabel,
+  TablePagination,
 } from '@mui/material';
-import { DataGrid } from '@mui/x-data-grid';
 import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import CancelIcon from '@mui/icons-material/Cancel';
 import DeleteIcon from '@mui/icons-material/Delete';
@@ -20,7 +27,7 @@ import { fetchUsersList, deleteUser, updateUserRole } from '../auth/authApi';
 
 const DEFAULT_ROLES = ['none', 'student', 'teacher', 'admin'];
 
-export function UserListComponent({ 
+export function UserListComponent({
     roles = DEFAULT_ROLES,
     currentUser,
     extraColumns = [],
@@ -42,6 +49,10 @@ export function UserListComponent({
   const [error, setError] = useState(null);
   const [rowActionLoading, setRowActionLoading] = useState({});
   const [searchQuery, setSearchQuery] = useState('');
+  const [sortField, setSortField] = useState('email');
+  const [sortDir, setSortDir] = useState('asc');
+  const [page, setPage] = useState(0);
+  const [pageSize, setPageSize] = useState(25);
   const controlSx = { minWidth: 140 };
   const actionButtonSx = { textTransform: 'none', minWidth: 90 };
 
@@ -69,6 +80,10 @@ export function UserListComponent({
     loadUsers();
   }, [loadUsers, refreshTrigger]);
 
+  useEffect(() => {
+    setPage(0);
+  }, [searchQuery]);
+
   const handleDelete = async (userId) => {
     if (!window.confirm(t('UserList.DELETE_CONFIRM', 'Are you sure you want to delete this user?'))) return;
     try {
@@ -106,14 +121,14 @@ export function UserListComponent({
   const defaultCanEdit = (targetUser) => {
       if (!currentUser) return false;
       if (currentUser.is_superuser) return true;
-      
+
       const myRole = currentUser.role || 'none';
       const targetRole = targetUser.role || 'none';
 
       if (myRole === 'admin') return true;
-      
+
       if (myRole === 'teacher') {
-          if (targetUser.id === currentUser.id) return false; 
+          if (targetUser.id === currentUser.id) return false;
           if (['teacher', 'admin', 'supervisor'].includes(targetRole)) return false;
           return true;
       }
@@ -267,16 +282,23 @@ export function UserListComponent({
         field: 'email',
         headerName: t('Auth.EMAIL_LABEL', 'Email'),
         minWidth: 220,
-        maxWidth: 340,
         flex: 1,
+        sortable: true,
+        align: 'left',
+        headerAlign: 'left',
+        valueGetter: (row) => row?.email ?? '',
+        renderCell: (row) => row.email,
       },
       {
         field: 'name',
         headerName: t('Profile.NAME_LABEL', 'Name'),
         minWidth: 180,
-        maxWidth: 260,
         flex: 0.9,
-        valueGetter: (_value, row) => getUserDisplayName(row),
+        sortable: true,
+        align: 'left',
+        headerAlign: 'left',
+        valueGetter: (row) => getUserDisplayName(row),
+        renderCell: (row) => getUserDisplayName(row),
       },
     ];
 
@@ -285,13 +307,13 @@ export function UserListComponent({
         field: 'is_new',
         headerName: t('UserList.NEW', 'New'),
         minWidth: 90,
-        maxWidth: 110,
         flex: 0.35,
+        sortable: true,
         align: 'center',
         headerAlign: 'center',
-        valueGetter: (_value, row) => Boolean(row?.profile?.is_new || row?.is_new),
-        renderCell: (params) => renderBooleanStatusIcon(
-          Boolean(params.row?.profile?.is_new || params.row?.is_new),
+        valueGetter: (row) => Boolean(row?.profile?.is_new || row?.is_new),
+        renderCell: (row) => renderBooleanStatusIcon(
+          Boolean(row?.profile?.is_new || row?.is_new),
           t('Common.YES', 'Yes'),
           t('Common.NO', 'No'),
         ),
@@ -303,13 +325,13 @@ export function UserListComponent({
         field: 'successful_login',
         headerName: t('UserList.SUCCESSFUL_LOGIN', 'Successful Login'),
         minWidth: 120,
-        maxWidth: 150,
         flex: 0.4,
+        sortable: true,
         align: 'center',
         headerAlign: 'center',
-        valueGetter: (_value, row) => Boolean(row?.successful_login ?? row?.last_login),
-        renderCell: (params) => renderBooleanStatusIcon(
-          Boolean(params.row?.successful_login ?? params.row?.last_login),
+        valueGetter: (row) => Boolean(row?.successful_login ?? row?.last_login),
+        renderCell: (row) => renderBooleanStatusIcon(
+          Boolean(row?.successful_login ?? row?.last_login),
           t('Common.YES', 'Yes'),
           t('Common.NO', 'No'),
         ),
@@ -321,23 +343,22 @@ export function UserListComponent({
         field: 'role',
         headerName: t('UserList.ROLE', 'Role'),
         minWidth: 180,
-        maxWidth: 240,
         flex: 0.7,
-        valueGetter: (_value, row) => row?.role || 'none',
-        renderCell: (params) => {
-          const user = params.row;
-          return (
-            <FormControl size="small" fullWidth sx={controlSx} disabled={!canEdit(user)}>
-              <Select
-                value={user.role || 'none'}
-                onChange={(event) => handleChangeRole(user.id, event.target.value)}
-                variant="outlined"
-              >
-                {roles.map((role) => <MenuItem key={role} value={role}>{role}</MenuItem>)}
-              </Select>
-            </FormControl>
-          );
-        },
+        sortable: true,
+        align: 'left',
+        headerAlign: 'left',
+        valueGetter: (row) => row?.role || 'none',
+        renderCell: (row) => (
+          <FormControl size="small" fullWidth sx={controlSx} disabled={!canEdit(row)}>
+            <Select
+              value={row.role || 'none'}
+              onChange={(event) => handleChangeRole(row.id, event.target.value)}
+              variant="outlined"
+            >
+              {roles.map((role) => <MenuItem key={role} value={role}>{role}</MenuItem>)}
+            </Select>
+          </FormControl>
+        ),
       });
     }
 
@@ -345,16 +366,15 @@ export function UserListComponent({
       field: `extra:${column.key}`,
       headerName: typeof column.label === 'function' ? column.label(listContext) : column.label,
       minWidth: Number(column.minWidth) || 180,
-      maxWidth: Number(column.maxWidth) || 320,
       flex: Number(column.flex) || 0.9,
       sortable: column.sortable !== false,
       align: column.align || 'left',
       headerAlign: column.align || 'left',
-      valueGetter: (_value, row) => getExtraColumnSortValue(column, row),
-      renderCell: (params) =>
+      valueGetter: (row) => getExtraColumnSortValue(column, row),
+      renderCell: (row) =>
         column.renderCell({
-          user: params.row,
-          canEdit: canEdit(params.row),
+          user: row,
+          canEdit: canEdit(row),
           currentUser,
           extraContext,
           t,
@@ -372,65 +392,61 @@ export function UserListComponent({
       field: 'actions',
       headerName: t('Common.ACTIONS', 'Actions'),
       minWidth: Math.max(220, 110 + (visibleRowActions.length + (showDeleteAction ? 1 : 0)) * 110),
-      maxWidth: Math.max(360, 120 + (visibleRowActions.length + (showDeleteAction ? 1 : 0)) * 120),
       flex: 1.1,
       sortable: false,
-      filterable: false,
-      disableColumnMenu: true,
-      renderCell: (params) => {
-        const user = params.row;
-
-        return (
-          <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 1, alignItems: 'center', py: 0.5 }}>
-            {visibleRowActions.map((action) => {
-              const actionId = `${action.key}:${user.id}`;
-              const isBusy = Boolean(rowActionLoading[actionId]);
-              const isDisabled = typeof action.disabled === 'function'
-                ? action.disabled({
-                    user,
-                    canEdit: canEdit(user),
-                    currentUser,
-                    extraContext,
-                    t,
-                  })
-                : false;
-
-              return (
+      align: 'left',
+      headerAlign: 'left',
+      valueGetter: null,
+      renderCell: (row) => (
+        <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 1, alignItems: 'center', py: 0.5 }}>
+          {visibleRowActions.map((action) => {
+            const actionId = `${action.key}:${row.id}`;
+            const isBusy = Boolean(rowActionLoading[actionId]);
+            const isDisabled = typeof action.disabled === 'function'
+              ? action.disabled({
+                  user: row,
+                  canEdit: canEdit(row),
+                  currentUser,
+                  extraContext,
+                  t,
+                })
+              : false;
+
+            return (
+              <Button
+                key={`${action.key}-${row.id}`}
+                size="small"
+                variant="outlined"
+                onClick={() => runRowAction(action, row)}
+                disabled={isBusy || isDisabled}
+                sx={actionButtonSx}
+              >
+                {typeof action.label === 'function'
+                  ? action.label({ user: row, t, currentUser, canEdit: canEdit(row) })
+                  : action.label}
+              </Button>
+            );
+          })}
+
+          {showDeleteAction && (
+            <Tooltip title={t('Common.DELETE', 'Delete')}>
+              <span>
                 <Button
-                  key={`${action.key}-${user.id}`}
                   size="small"
                   variant="outlined"
-                  onClick={() => runRowAction(action, user)}
-                  disabled={isBusy || isDisabled}
+                  color="error"
+                  startIcon={<DeleteIcon />}
+                  onClick={() => handleDelete(row.id)}
+                  disabled={!canDelete(row)}
                   sx={actionButtonSx}
                 >
-                  {typeof action.label === 'function'
-                    ? action.label({ user, t, currentUser, canEdit: canEdit(user) })
-                    : action.label}
+                  {t('Common.DELETE', 'Delete')}
                 </Button>
-              );
-            })}
-
-            {showDeleteAction && (
-              <Tooltip title={t('Common.DELETE', 'Delete')}>
-                <span>
-                  <Button
-                    size="small"
-                    variant="outlined"
-                    color="error"
-                    startIcon={<DeleteIcon />}
-                    onClick={() => handleDelete(user.id)}
-                    disabled={!canDelete(user)}
-                    sx={actionButtonSx}
-                  >
-                    {t('Common.DELETE', 'Delete')}
-                  </Button>
-                </span>
-              </Tooltip>
-            )}
-          </Box>
-        );
-      },
+              </span>
+            </Tooltip>
+          )}
+        </Box>
+      ),
     };
 
     return [...baseColumns, ...mappedExtraColumns, actionColumn];
@@ -452,6 +468,31 @@ export function UserListComponent({
     canDelete,
   ]);
 
+  const sortedUsers = useMemo(() => {
+    const col = columns.find((c) => c.field === sortField);
+    return [...filteredUsers].sort((a, b) => {
+      const aVal = col?.valueGetter ? col.valueGetter(a) : (a[sortField] ?? '');
+      const bVal = col?.valueGetter ? col.valueGetter(b) : (b[sortField] ?? '');
+      const cmp = String(aVal ?? '').localeCompare(String(bVal ?? ''), undefined, { numeric: true, sensitivity: 'base' });
+      return sortDir === 'asc' ? cmp : -cmp;
+    });
+  }, [filteredUsers, sortField, sortDir, columns]);
+
+  const pagedUsers = useMemo(
+    () => sortedUsers.slice(page * pageSize, page * pageSize + pageSize),
+    [sortedUsers, page, pageSize],
+  );
+
+  const handleSortClick = (field) => {
+    if (sortField === field) {
+      setSortDir((d) => (d === 'asc' ? 'desc' : 'asc'));
+    } else {
+      setSortField(field);
+      setSortDir('asc');
+    }
+    setPage(0);
+  };
+
   return (
     <Box>
       <Typography variant="h6" gutterBottom>{t('UserList.TITLE', 'All Users')}</Typography>
@@ -466,7 +507,7 @@ export function UserListComponent({
           onChange={(event) => setSearchQuery(event.target.value)}
         />
       </Box>
-      
+
       {error && <Alert severity="error" sx={{ mb: 2 }}>{t(error)}</Alert>}
 
       {loading && (
@@ -476,40 +517,73 @@ export function UserListComponent({
       )}
 
       {!loading && (
-        <Box sx={{ width: '100%', minHeight: 520 }}>
-          <DataGrid
-            rows={filteredUsers}
-            columns={columns}
-            disableRowSelectionOnClick
-            showToolbar
-            getRowHeight={() => 'auto'}
-            pageSizeOptions={[10, 25, 50, 100]}
-            initialState={{
-              sorting: { sortModel: [{ field: 'email', sort: 'asc' }] },
-              pagination: { paginationModel: { pageSize: 25, page: 0 } },
-            }}
-            localeText={{
-              noRowsLabel: t('UserList.NO_USERS', 'No users found.'),
-              toolbarQuickFilterPlaceholder: t('UserList.SEARCH_PLACEHOLDER', 'Search users...'),
-            }}
-            slotProps={{
-              toolbar: {
-                showQuickFilter: true,
-                quickFilterProps: { debounceMs: 300 },
-              },
-            }}
-            sx={{
-              border: 1,
-              borderColor: 'divider',
-              '& .MuiDataGrid-cell': {
-                display: 'flex',
-                alignItems: 'flex-start',
-                py: 1,
-              },
-              '& .MuiDataGrid-columnHeaders': {
-                bgcolor: 'action.hover',
-              },
+        <Box sx={{ width: '100%' }}>
+          <TableContainer sx={{ border: 1, borderColor: 'divider', borderRadius: 1 }}>
+            <Table size="small">
+              <TableHead sx={{ bgcolor: 'action.hover' }}>
+                <TableRow>
+                  {columns.map((col) => (
+                    <TableCell
+                      key={col.field}
+                      align={col.headerAlign || col.align || 'left'}
+                      sortDirection={sortField === col.field ? sortDir : false}
+                      sx={{ minWidth: col.minWidth, fontWeight: 600, whiteSpace: 'nowrap' }}
+                    >
+                      {col.sortable !== false ? (
+                        <TableSortLabel
+                          active={sortField === col.field}
+                          direction={sortField === col.field ? sortDir : 'asc'}
+                          onClick={() => handleSortClick(col.field)}
+                        >
+                          {col.headerName}
+                        </TableSortLabel>
+                      ) : (
+                        col.headerName
+                      )}
+                    </TableCell>
+                  ))}
+                </TableRow>
+              </TableHead>
+              <TableBody>
+                {pagedUsers.length === 0 ? (
+                  <TableRow>
+                    <TableCell
+                      colSpan={columns.length}
+                      align="center"
+                      sx={{ py: 4, color: 'text.secondary' }}
+                    >
+                      {t('UserList.NO_USERS', 'No users found.')}
+                    </TableCell>
+                  </TableRow>
+                ) : (
+                  pagedUsers.map((row) => (
+                    <TableRow key={row.id} hover>
+                      {columns.map((col) => (
+                        <TableCell
+                          key={col.field}
+                          align={col.align || 'left'}
+                          sx={{ verticalAlign: 'top', py: 1 }}
+                        >
+                          {col.renderCell(row)}
+                        </TableCell>
+                      ))}
+                    </TableRow>
+                  ))
+                )}
+              </TableBody>
+            </Table>
+          </TableContainer>
+          <TablePagination
+            component="div"
+            count={sortedUsers.length}
+            page={page}
+            onPageChange={(_, newPage) => setPage(newPage)}
+            rowsPerPage={pageSize}
+            onRowsPerPageChange={(event) => {
+              setPageSize(Number(event.target.value));
+              setPage(0);
             }}
+            rowsPerPageOptions={[10, 25, 50, 100]}
           />
         </Box>
       )}

package/src/i18n/notificationsTranslations.ts

@@ -0,0 +1,17 @@
+export const notificationsTranslations = {
+  'NotificationSettings.TITLE': { de: 'Benachrichtigungen', fr: 'Notifications', en: 'Notifications', sw: 'Arifa' },
+  'NotificationSettings.SUBTITLE': { de: 'Lege fest, wie du informiert werden möchtest.', fr: 'Choisissez comment vous souhaitez être informé.', en: 'Choose how you want to be notified.', sw: 'Chagua jinsi unavyotaka kuarifiwa.' },
+  'NotificationSettings.LOAD_ERROR': { de: 'Benachrichtigungseinstellungen konnten nicht geladen werden.', fr: 'Impossible de charger les paramètres de notification.', en: 'Notification settings could not be loaded.', sw: 'Mipangilio ya arifa haikuweza kupakiwa.' },
+  'NotificationSettings.SAVE_ERROR': { de: 'Benachrichtigungseinstellungen konnten nicht gespeichert werden.', fr: 'Impossible d’enregistrer les paramètres de notification.', en: 'Notification settings could not be saved.', sw: 'Mipangilio ya arifa haikuweza kuhifadhiwa.' },
+  'NotificationSettings.EMAIL_LABEL': { de: 'E-Mail-Benachrichtigungen', fr: 'Notifications par e-mail', en: 'Email notifications', sw: 'Arifa za barua pepe' },
+  'NotificationSettings.EMAIL_HINT': { de: 'Erhalte wichtige Informationen per E-Mail.', fr: 'Recevez les informations importantes par e-mail.', en: 'Receive important information by email.', sw: 'Pokea taarifa muhimu kwa barua pepe.' },
+  'NotificationSettings.PUSH_LABEL': { de: 'Push-Benachrichtigungen', fr: 'Notifications push', en: 'Push notifications', sw: 'Arifa za push' },
+  'NotificationSettings.PUSH_HINT': { de: 'Aktiviere Benachrichtigungen für dieses Gerät.', fr: 'Activez les notifications pour cet appareil.', en: 'Enable notifications for this device.', sw: 'Washa arifa kwa kifaa hiki.' },
+  'NotificationSettings.PUSH_ENABLE': { de: 'Push aktivieren', fr: 'Activer les notifications push', en: 'Enable push', sw: 'Washa push' },
+  'NotificationSettings.PUSH_DISABLE': { de: 'Push auf diesem Gerät deaktivieren', fr: 'Désactiver les notifications push sur cet appareil', en: 'Disable push on this device', sw: 'Zima push kwenye kifaa hiki' },
+  'NotificationSettings.PUSH_DENIED': { de: 'Die Browserberechtigung für Push-Benachrichtigungen wurde verweigert.', fr: 'L’autorisation du navigateur pour les notifications push a été refusée.', en: 'Browser permission for push notifications was denied.', sw: 'Ruhusa ya kivinjari kwa arifa za push imekataliwa.' },
+  'NotificationSettings.PUSH_ERROR': { de: 'Push-Benachrichtigungen konnten nicht aktualisiert werden.', fr: 'Impossible de mettre à jour les notifications push.', en: 'Push notifications could not be updated.', sw: 'Arifa za push hazikuweza kusasishwa.' },
+  'NotificationSettings.PUSH_CONFLICT': { de: 'Dieses Gerät ist bereits mit einem anderen Konto für Push-Benachrichtigungen verbunden.', fr: 'Cet appareil est déjà associé à un autre compte pour les notifications push.', en: 'This device is already associated with another account for push notifications.', sw: 'Kifaa hiki tayari kimeunganishwa na akaunti nyingine kwa arifa za push.' },
+  'NotificationSettings.PUSH_NOT_SUPPORTED': { de: 'Push-Benachrichtigungen werden von diesem Browser nicht unterstützt.', fr: 'Les notifications push ne sont pas prises en charge par ce navigateur.', en: 'Push notifications are not supported by this browser.', sw: 'Arifa za push hazitumiki na kivinjari hiki.' },
+  'NotificationSettings.IOS_HINT': { de: 'Füge diese App zuerst zum Home-Bildschirm hinzu, um Push-Benachrichtigungen zu aktivieren.', fr: 'Ajoutez d’abord cette application à l’écran d’accueil pour activer les notifications push.', en: 'Add this app to your home screen first to enable push notifications.', sw: 'Ongeza programu hii kwenye skrini yako ya mwanzo kwanza ili kuwasha arifa za push.' },
+};

package/src/i18n/onboardingTranslations.ts

@@ -0,0 +1,17 @@
+export const onboardingTranslations = {
+  'Onboarding.SETUP': { de: 'Einrichtung', fr: 'Configuration', en: 'Setup', sw: 'Usanidi' },
+  'Onboarding.STEP_COUNTER': { de: 'Schritt {{current}} von {{total}}', fr: 'Étape {{current}} sur {{total}}', en: 'Step {{current}} of {{total}}', sw: 'Hatua ya {{current}} kati ya {{total}}' },
+  'Onboarding.COOKIE_CONSENT_TITLE': { de: 'Cookie-Einstellungen', fr: 'Préférences des cookies', en: 'Cookie preferences', sw: 'Mapendeleo ya vidakuzi' },
+  'Onboarding.COOKIE_CONSENT_BODY': { de: 'Diese App verwendet optionale Cookies, um deine Einstellungen und Präferenzen zu speichern. Möchtest du diese aktivieren?', fr: 'Cette application utilise des cookies facultatifs pour enregistrer vos réglages et préférences. Souhaitez-vous les activer ?', en: 'This app uses optional cookies to save your settings and preferences. Would you like to enable them?', sw: 'Programu hii hutumia vidakuzi vya hiari kuhifadhi mipangilio na mapendeleo yako. Je, ungependa kuviwasha?' },
+  'Onboarding.COOKIE_CONSENT_ACCEPT': { de: 'Akzeptieren', fr: 'Accepter', en: 'Accept', sw: 'Kubali' },
+  'Onboarding.COOKIE_CONSENT_ERROR': { de: 'Die Cookie-Einstellung konnte nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Impossible d’enregistrer votre préférence de cookies. Veuillez réessayer.', en: 'Your cookie preference could not be saved. Please try again.', sw: 'Upendeleo wako wa vidakuzi haukuweza kuhifadhiwa. Tafadhali jaribu tena.' },
+  'Onboarding.COMPLETE_NAME_TITLE': { de: 'Dein Name', fr: 'Votre nom', en: 'Your name', sw: 'Jina lako' },
+  'Onboarding.COMPLETE_NAME_BODY': { de: 'Bitte gib deinen Vor- und Nachnamen an, damit andere dich erkennen.', fr: 'Veuillez indiquer votre prénom et votre nom afin que les autres puissent vous reconnaître.', en: 'Please provide your first and last name so others can recognise you.', sw: 'Tafadhali weka jina lako la kwanza na la mwisho ili wengine wakutambue.' },
+  'Onboarding.FIRST_NAME_LABEL': { de: 'Vorname', fr: 'Prénom', en: 'First name', sw: 'Jina la kwanza' },
+  'Onboarding.LAST_NAME_LABEL': { de: 'Nachname', fr: 'Nom', en: 'Last name', sw: 'Jina la mwisho' },
+  'Onboarding.SAVE': { de: 'Speichern', fr: 'Enregistrer', en: 'Save', sw: 'Hifadhi' },
+  'Onboarding.COMPLETE_NAME_ERROR': { de: 'Der Name konnte nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Impossible d’enregistrer votre nom. Veuillez réessayer.', en: 'Your name could not be saved. Please try again.', sw: 'Jina lako halikuweza kuhifadhiwa. Tafadhali jaribu tena.' },
+  'Onboarding.BROWSER_PUSH_TITLE': { de: 'Push-Benachrichtigungen', fr: 'Notifications push', en: 'Push notifications', sw: 'Arifa za push' },
+  'Onboarding.BROWSER_PUSH_BODY': { de: 'Erhalte Benachrichtigungen direkt im Browser, auch wenn die App nicht geöffnet ist.', fr: 'Recevez des notifications directement dans votre navigateur, même lorsque l’application est fermée.', en: 'Receive notifications directly in your browser, even when the app is not open.', sw: 'Pokea arifa moja kwa moja kwenye kivinjari chako, hata programu haijafunguliwa.' },
+  'Onboarding.SKIP': { de: 'Überspringen', fr: 'Passer', en: 'Skip', sw: 'Ruka' },
+};

package/src/index.js

@@ -41,3 +41,25 @@ export { QrSignupManager } from './components/QrSignupManager';
 
 // --- 6. Translations ---
 export { authTranslations } from './i18n/authTranslations';
+
+// --- 7. Notifications ---
+export { NotificationSettings } from './notifications/NotificationSettings';
+export * from './notifications/api';
+
+// --- 8. Onboarding ---
+export * from './onboarding/api';
+export { selectActiveSteps } from './onboarding/stepSelection';
+export {
+  OnboardingContext,
+  OnboardingProvider,
+  UNIVERSAL_STEP_DESCRIPTORS,
+  useOnboarding,
+} from './onboarding/OnboardingProvider';
+export { OnboardingWizard } from './onboarding/OnboardingWizard';
+export { CookieConsentStep } from './onboarding/steps/CookieConsentStep';
+export { CompleteNameStep } from './onboarding/steps/CompleteNameStep';
+export { BrowserPushStep } from './onboarding/steps/BrowserPushStep';
+
+// --- 9. Translations ---
+export { notificationsTranslations } from './i18n/notificationsTranslations';
+export { onboardingTranslations } from './i18n/onboardingTranslations';