@ssoeasy-dev/react 1.0.0-beta.64cfe3a → 1.0.0-beta.97c4d20

package/README.md

@@ -0,0 +1,179 @@
+# @ssoeasy-dev/react
+
+React-адаптер для SSO Easy. Оборачивает `@ssoeasy-dev/core` в React Context и предоставляет хук `useAuth` и компонент `ProtectedRoute`.
+
+## Установка
+
+```bash
+npm install @ssoeasy-dev/react @ssoeasy-dev/core
+```
+
+## Быстрый старт
+
+### 1. Оборачиваем приложение в `AuthProvider`
+
+```tsx
+import { AuthProvider } from "@ssoeasy-dev/react";
+import { AuthManager } from "@ssoeasy-dev/core";
+
+const auth = new AuthManager({
+  serviceId: "your-service-id",
+  redirectUri: "https://yourapp.com",
+  loginPath: "/callback",
+  authPageUrl: "https://sso.example.com/login",
+  authServerConfig: {
+    baseURL: "https://api.example.com",
+  },
+});
+
+function App() {
+  return (
+    <AuthProvider auth={auth}>
+      <AppRouter />
+    </AuthProvider>
+  );
+}
+```
+
+### 2. Защищаем роуты через `ProtectedRoute`
+
+```tsx
+import { BrowserRouter, Route, Routes } from "react-router-dom";
+import { ProtectedRoute } from "@ssoeasy-dev/react";
+
+function AppRouter() {
+  return (
+    <BrowserRouter>
+      <Routes>
+        <Route path="/callback" element={<CallbackPage />} />
+        <Route path="/" element={<PublicPage />} />
+        <Route
+          path="/dashboard"
+          element={
+            <ProtectedRoute redirectTo="/dashboard">
+              <Dashboard />
+            </ProtectedRoute>
+          }
+        />
+      </Routes>
+    </BrowserRouter>
+  );
+}
+```
+
+### 3. Используем `useAuth` в компонентах
+
+```tsx
+import { useAuth } from "@ssoeasy-dev/react";
+
+function Header() {
+  const auth = useAuth();
+
+  return (
+    <header>
+      {auth.getState().isAuthenticated ? (
+        <button onClick={() => auth.logout()}>Выйти</button>
+      ) : (
+        <button onClick={() => auth.login()}>Войти</button>
+      )}
+    </header>
+  );
+}
+```
+
+### 4. Страница callback
+
+```tsx
+import { useEffect } from "react";
+import { useAuth } from "@ssoeasy-dev/react";
+import { useNavigate } from "react-router-dom";
+
+function CallbackPage() {
+  const auth = useAuth();
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    auth.handleRedirectCallback().then(({ redirectTo }) => {
+      navigate(redirectTo, { replace: true });
+    });
+  }, []);
+
+  return <div>Авторизация...</div>;
+}
+```
+
+## API
+
+### `AuthProvider`
+
+```tsx
+<AuthProvider auth={AuthManager}>{children}</AuthProvider>
+```
+
+Предоставляет `AuthManager` через React Context. Должен оборачивать всё приложение.
+
+### `useAuth`
+
+```tsx
+const auth = useAuth(); // возвращает AuthManager
+```
+
+Хук для доступа к `AuthManager` внутри компонентов. Выбрасывает ошибку если вызван вне `AuthProvider`.
+
+### `ProtectedRoute`
+
+```tsx
+<ProtectedRoute
+  redirectTo="/target-path" // путь для redirectTo при логине (опционально)
+  fallback={<Spinner />} // отображается во время checkAuth (по умолчанию <div>Loading...</div>)
+  unauthenticatedElement={<Node />} // рендерится вместо редиректа на SSO, если пользователь не авторизован (опционально)
+>
+  <ProtectedContent />
+</ProtectedRoute>
+```
+
+При монтировании вызывает `auth.checkAuth()`. Пока идёт проверка — рендерит `fallback`.
+
+Если пользователь не авторизован:
+
+- **`unauthenticatedElement` не передан** — вызывает `auth.login({ redirectTo })`, редирект на SSO (поведение по умолчанию)
+- **`unauthenticatedElement` передан** — рендерит переданный элемент без редиректа
+
+#### Пример: внутренняя страница выбора входа/регистрации
+
+Если в приложении есть собственная страница `/auth` с кнопками «Войти» и «Зарегистрироваться», можно передать `<Navigate>` вместо того, чтобы сразу уходить на SSO:
+
+```tsx
+import { Navigate } from "react-router-dom";
+import { ProtectedRoute } from "@ssoeasy-dev/react";
+
+const LayoutWrapper = () => {
+  return (
+    <ProtectedRoute unauthenticatedElement={<Navigate to="/auth" replace />}>
+      <Layout>
+        <Outlet />
+      </Layout>
+    </ProtectedRoute>
+  );
+};
+```
+
+Страница `/auth` при этом остаётся публичной — она не обёрнута в `ProtectedRoute`.
+
+## Экспорты
+
+```typescript
+export { AuthProvider } from "./AuthProvider";
+export { ProtectedRoute } from "./ProtectedRoute";
+export { useAuth } from "./useAuth";
+```
+
+## Лицензия
+
+MIT — см. [LICENSE](../LICENSE).
+
+## Контакты
+
+- Email: morewiktor@yandex.ru
+- Telegram: [@MoreWiktor](https://t.me/MoreWiktor)
+- GitHub: [@MoreWiktor](https://github.com/MoreWiktor)

package/dist/ProtectedRoute.d.ts

@@ -3,5 +3,6 @@ export declare const ProtectedRoute: React.FC<{
     children: React.ReactNode;
     redirectTo?: string;
     fallback?: React.ReactNode;
+    unauthenticatedElement?: React.ReactNode;
 }>;
 //# sourceMappingURL=ProtectedRoute.d.ts.map

package/dist/ProtectedRoute.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProtectedRoute.d.ts","sourceRoot":"","sources":["../src/ProtectedRoute.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAgBA,CAAC"}
+{"version":3,"file":"ProtectedRoute.d.ts","sourceRoot":"","sources":["../src/ProtectedRoute.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,sBAAsB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1C,CA0BA,CAAC"}

package/dist/ProtectedRoute.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { useAuth } from "./useAuth";
-export const ProtectedRoute = ({ children, redirectTo, fallback = _jsx("div", { children: "Loading..." }) }) => {
+export const ProtectedRoute = ({ children, redirectTo, fallback = _jsx("div", { children: "Loading..." }), unauthenticatedElement, }) => {
     const auth = useAuth();
     const [isAuthorized, setIsAuthorized] = useState(null);
     useEffect(() => {
@@ -12,6 +12,9 @@ export const ProtectedRoute = ({ children, redirectTo, fallback = _jsx("div", {
     if (isAuthorized === null)
         return fallback;
     if (!isAuthorized) {
+        if (unauthenticatedElement !== undefined) {
+            return _jsx(_Fragment, { children: unauthenticatedElement });
+        }
         auth.login({ redirectTo });
         return null;
     }

package/dist/ProtectedRoute.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProtectedRoute.js","sourceRoot":"","sources":["../src/ProtectedRoute.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,MAAM,CAAC,MAAM,cAAc,GAItB,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,GAAG,uCAAqB,EAAE,EAAE,EAAE;IAClE,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IAEvE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;YAC5B,eAAe,CAAC,GAAG,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAI,YAAY,KAAK,IAAI;QAAE,OAAO,QAAQ,CAAC;IAC3C,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,IAAI,CAAC,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IACD,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC,CAAC"}
+{"version":3,"file":"ProtectedRoute.js","sourceRoot":"","sources":["../src/ProtectedRoute.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,MAAM,CAAC,MAAM,cAAc,GAKtB,CAAC,EACJ,QAAQ,EACR,UAAU,EACV,QAAQ,GAAG,uCAAqB,EAChC,sBAAsB,GACvB,EAAE,EAAE;IACH,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAC;IAEvE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE;YAC5B,eAAe,CAAC,GAAG,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAI,YAAY,KAAK,IAAI;QAAE,OAAO,QAAQ,CAAC;IAE3C,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,IAAI,sBAAsB,KAAK,SAAS,EAAE,CAAC;YACzC,OAAO,4BAAG,sBAAsB,GAAI,CAAC;QACvC,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ssoeasy-dev/react",
-  "version": "1.0.0-beta.64cfe3a",
+  "version": "1.0.0-beta.97c4d20",
   "description": "",
   "main": "index.ts",
   "types": "index.ts",
@@ -15,9 +15,9 @@
     "README.md",
     "LICENSE"
   ],
-  "dependencies": {
-    "@ssoeasy-dev/core": "1.0.0-beta.2bdd988",
-    "react": "^19.2.4"
+  "peerDependencies": {
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "@ssoeasy-dev/core": "1.0.0-beta.2bdd988"
   },
   "devDependencies": {
     "@types/react": "^19.2.14",