@atls/react-kratos-browser-flows 0.0.1 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/flows/abstract.flow.d.ts +15 -13
  3. package/dist/flows/abstract.flow.js +26 -38
  4. package/dist/flows/errors.flow.js +1 -1
  5. package/dist/flows/flow.interfaces.d.ts +18 -19
  6. package/dist/flows/index.d.ts +2 -1
  7. package/dist/flows/index.js +6 -2
  8. package/dist/flows/kratos.client.d.ts +2 -2
  9. package/dist/flows/kratos.client.js +1 -1
  10. package/dist/flows/login.flow.js +3 -2
  11. package/dist/flows/logout.flow.d.ts +5 -0
  12. package/dist/flows/logout.flow.js +22 -0
  13. package/dist/flows/recovery.flow.js +3 -2
  14. package/dist/flows/registration.flow.js +3 -2
  15. package/dist/flows/settings.flow.js +5 -4
  16. package/dist/flows/verification.flow.js +3 -2
  17. package/dist/index.js +5 -1
  18. package/dist/providers/flows.context.d.ts +1 -1
  19. package/dist/providers/flows.context.js +1 -1
  20. package/dist/providers/index.d.ts +1 -0
  21. package/dist/providers/index.js +6 -1
  22. package/dist/providers/kraots-logout-flow.provider.d.ts +3 -0
  23. package/dist/providers/kraots-logout-flow.provider.js +7 -0
  24. package/dist/providers/kratos-errors-flow.provider.d.ts +3 -1
  25. package/dist/providers/kratos-errors-flow.provider.js +2 -5
  26. package/dist/providers/kratos-flow.provider.d.ts +4 -2
  27. package/dist/providers/kratos-flow.provider.js +29 -32
  28. package/dist/providers/kratos-login-flow.provider.d.ts +3 -1
  29. package/dist/providers/kratos-login-flow.provider.js +2 -5
  30. package/dist/providers/kratos-recovery-flow.provider.d.ts +3 -1
  31. package/dist/providers/kratos-recovery-flow.provider.js +2 -5
  32. package/dist/providers/kratos-registration-flow.provider.d.ts +3 -1
  33. package/dist/providers/kratos-registration-flow.provider.js +2 -5
  34. package/dist/providers/kratos-settings-flow.provider.d.ts +3 -1
  35. package/dist/providers/kratos-settings-flow.provider.js +2 -5
  36. package/dist/providers/kratos-verification-flow.provider.d.ts +3 -1
  37. package/dist/providers/kratos-verification-flow.provider.js +2 -5
  38. package/dist/providers/use-flow.hook.d.ts +1 -1
  39. package/dist/providers/use-flow.hook.js +3 -3
  40. package/dist/ui/flow-error.component.d.ts +3 -3
  41. package/dist/ui/flow-error.component.js +2 -2
  42. package/dist/ui/flow-form.component.d.ts +6 -4
  43. package/dist/ui/flow-form.component.js +6 -21
  44. package/dist/ui/flow-messages.component.d.ts +4 -4
  45. package/dist/ui/flow-messages.component.js +2 -2
  46. package/dist/ui/flow-node-messages.component.d.ts +4 -4
  47. package/dist/ui/flow-node-messages.component.js +2 -2
  48. package/dist/ui/flow-node.component.d.ts +6 -18
  49. package/dist/ui/flow-node.component.js +5 -5
  50. package/dist/ui/flow-nodes-group.component.d.ts +4 -17
  51. package/dist/ui/flow-nodes-group.component.js +1 -1
  52. package/dist/ui/flow-submit.component.d.ts +8 -4
  53. package/dist/ui/flow-submit.component.js +4 -4
  54. package/dist/ui/index.js +5 -1
  55. package/package.json +14 -17
package/CHANGELOG.md ADDED
@@ -0,0 +1,23 @@
1
+ ## Unreleased
2
+
3
+ ### Migration notes
4
+
5
+ - `Flow#getState()` is now typed as `State | undefined`, reflecting its existing runtime value before a flow is loaded. Repository consumers use `hasState()`, optional handling, or the guarded submit paths; external consumers must handle the pre-load state explicitly.
6
+ - `FlowName` now includes `logout`, matching the existing logout provider without a type assertion. External exhaustive `FlowName` handling must include the new member.
7
+
8
+ ## 0.0.3 (2025-01-22)
9
+
10
+ ### Bug Fixes
11
+
12
+ - **react:** lint and typecheck errors ([a090051](https://github.com/atls/reactjs/commit/a090051d1007e171df8066e85f15fcf8fd44c4ed))
13
+ - upgrade react, types fixes ([34feb02](https://github.com/atls/reactjs/commit/34feb027a2e2d7e5741509fd1ff846755d217b97))
14
+ - upgrade yarn, typescript, set resolutions ([b235334](https://github.com/atls/reactjs/commit/b23533417af6fb323187ef281b83d8dc5e7bd9dd))
15
+
16
+ ### Features
17
+
18
+ - add emotion as deps, bump @types/react ([1ce29b3](https://github.com/atls/reactjs/commit/1ce29b384640d9be0550d9c6f4dc07083821137a))
19
+ - **common:** bump yarn ([#143](https://github.com/atls/reactjs/issues/143)) ([8239f82](https://github.com/atls/reactjs/commit/8239f82f1c85d872a99613d3693babc761703b05))
20
+ - **kratos:** remove form, add browser flow ([65f61dd](https://github.com/atls/reactjs/commit/65f61dd5e8e80fd1b3eb0dc848ba4d7a7b8b0e9c))
21
+ - react bump ([#144](https://github.com/atls/reactjs/issues/144)) ([9770fa1](https://github.com/atls/reactjs/commit/9770fa10451b647ed48e226270da68228714d174))
22
+ - update kratos browser flows to client 0.8.2 ([52f9c0f](https://github.com/atls/reactjs/commit/52f9c0fa129cd7d4567ab826c754483a6ddd6817))
23
+ - upgraded ([71a06f6](https://github.com/atls/reactjs/commit/71a06f6f498c928ed33b79f93af5d398a32af487))
@@ -1,27 +1,29 @@
1
- /// <reference types="node" />
2
- import { EventEmitter } from 'events';
3
- import { KratosClient } from './kratos.client';
1
+ import type { UiNode } from '@ory/kratos-client';
2
+ import type { UiText } from '@ory/kratos-client';
4
3
  import type { SubmitSelfServiceFlowBody } from './flow.interfaces';
5
4
  import type { SelfServiceFlow } from './flow.interfaces';
6
5
  import type { Flow } from './flow.interfaces';
6
+ import type { KratosClient } from './kratos.client';
7
+ import { EventEmitter } from 'events';
7
8
  export declare abstract class AbstractFlow<State extends SelfServiceFlow, Body extends SubmitSelfServiceFlowBody> extends EventEmitter implements Flow {
8
9
  #private;
9
10
  protected readonly client: KratosClient;
10
11
  constructor(client: KratosClient);
11
- setLoading(loading: any): void;
12
+ setLoading(loading: boolean): void;
12
13
  isLoading(): boolean;
13
- setState(state: any): void;
14
+ setState(state: SelfServiceFlow): void;
14
15
  hasState(): boolean;
15
- getState(): State;
16
- getMessages(): import("@ory/kratos-client").UiText[];
17
- getNode(name: any): import("@ory/kratos-client").UiNode | undefined;
18
- getNodes(name: any): import("@ory/kratos-client").UiNode[];
19
- getNodesGroup(group: any): import("@ory/kratos-client").UiNode[];
20
- getValue(name: any): string | any;
16
+ getState(): State | undefined;
17
+ getMessages(): Array<UiText>;
18
+ getNode(name: string): UiNode | undefined;
19
+ getNodes(name: string): Array<UiNode>;
20
+ getNodesGroup(group: string): Array<UiNode>;
21
+ getValue(name: string): string;
21
22
  getValues(): Body;
22
23
  setValue(name: string, value: string): void;
23
24
  protected setValues(state: State): void;
25
+ protected requireState(): State;
24
26
  protected complete(href?: string): void;
25
- abstract load(): any;
26
- abstract submit(method?: string): any;
27
+ abstract load(): Promise<void>;
28
+ abstract submit(method?: string): Promise<void>;
27
29
  }
@@ -1,82 +1,70 @@
1
1
  "use strict";
2
- var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, privateMap, value) {
3
- if (!privateMap.has(receiver)) {
4
- throw new TypeError("attempted to set private field on non-instance");
5
- }
6
- privateMap.set(receiver, value);
7
- return value;
8
- };
9
- var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, privateMap) {
10
- if (!privateMap.has(receiver)) {
11
- throw new TypeError("attempted to get private field on non-instance");
12
- }
13
- return privateMap.get(receiver);
14
- };
15
- var _values, _state, _loading;
16
2
  Object.defineProperty(exports, "__esModule", { value: true });
17
3
  exports.AbstractFlow = void 0;
18
4
  const events_1 = require("events");
19
5
  class AbstractFlow extends events_1.EventEmitter {
6
+ client;
7
+ #values = {};
8
+ #state;
9
+ #loading = false;
20
10
  constructor(client) {
21
11
  super();
22
12
  this.client = client;
23
- _values.set(this, {});
24
- _state.set(this, void 0);
25
- _loading.set(this, false);
26
13
  this.setMaxListeners(50);
27
14
  }
28
15
  setLoading(loading) {
29
- __classPrivateFieldSet(this, _loading, loading);
16
+ this.#loading = loading;
30
17
  }
31
18
  isLoading() {
32
- return __classPrivateFieldGet(this, _loading);
19
+ return this.#loading;
33
20
  }
34
21
  setState(state) {
35
- __classPrivateFieldSet(this, _state, state);
22
+ this.#state = state;
36
23
  }
37
24
  hasState() {
38
- return Boolean(__classPrivateFieldGet(this, _state));
25
+ return Boolean(this.#state);
39
26
  }
40
27
  getState() {
41
- return __classPrivateFieldGet(this, _state);
28
+ return this.#state;
42
29
  }
43
30
  getMessages() {
44
- var _a, _b;
45
- return ((_b = (_a = __classPrivateFieldGet(this, _state)) === null || _a === void 0 ? void 0 : _a.ui) === null || _b === void 0 ? void 0 : _b.messages) || [];
31
+ return this.#state?.ui.messages || [];
46
32
  }
47
33
  getNode(name) {
48
- var _a, _b, _c;
49
- return (_c = (_b = (_a = __classPrivateFieldGet(this, _state)) === null || _a === void 0 ? void 0 : _a.ui) === null || _b === void 0 ? void 0 : _b.nodes) === null || _c === void 0 ? void 0 : _c.find((node) => node.attributes.name === name);
34
+ return this.#state?.ui.nodes.find((node) => node.attributes.name === name);
50
35
  }
51
36
  getNodes(name) {
52
- var _a, _b, _c;
53
- return (((_c = (_b = (_a = __classPrivateFieldGet(this, _state)) === null || _a === void 0 ? void 0 : _a.ui) === null || _b === void 0 ? void 0 : _b.nodes) === null || _c === void 0 ? void 0 : _c.filter((node) => node.attributes.name === name)) || []);
37
+ return (this.#state?.ui.nodes.filter((node) => node.attributes.name === name) || []);
54
38
  }
55
39
  getNodesGroup(group) {
56
- var _a, _b, _c;
57
- return ((_c = (_b = (_a = __classPrivateFieldGet(this, _state)) === null || _a === void 0 ? void 0 : _a.ui) === null || _b === void 0 ? void 0 : _b.nodes) === null || _c === void 0 ? void 0 : _c.filter((node) => node.group === group)) || [];
40
+ return this.#state?.ui.nodes.filter((node) => node.group === group) || [];
58
41
  }
59
42
  getValue(name) {
60
- return __classPrivateFieldGet(this, _values)[name];
43
+ return this.#values[name];
61
44
  }
62
45
  getValues() {
63
- return __classPrivateFieldGet(this, _values);
46
+ return this.#values;
64
47
  }
65
48
  setValue(name, value) {
66
- __classPrivateFieldGet(this, _values)[name] = value;
49
+ this.#values[name] = value;
67
50
  }
68
51
  setValues(state) {
69
- var _a, _b;
70
- (_b = (_a = state === null || state === void 0 ? void 0 : state.ui) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b.forEach(({ attributes }) => {
71
- if (!__classPrivateFieldGet(this, _values)[attributes.name]) {
72
- __classPrivateFieldGet(this, _values)[attributes.name] =
52
+ state.ui.nodes.forEach(({ attributes }) => {
53
+ if (!this.#values[attributes.name]) {
54
+ this.#values[attributes.name] =
73
55
  attributes.value || '';
74
56
  }
75
57
  });
76
58
  }
59
+ requireState() {
60
+ const state = this.getState();
61
+ if (!state) {
62
+ throw new Error('Flow state is not loaded');
63
+ }
64
+ return state;
65
+ }
77
66
  complete(href = '/') {
78
67
  window.location.href = href;
79
68
  }
80
69
  }
81
70
  exports.AbstractFlow = AbstractFlow;
82
- _values = new WeakMap(), _state = new WeakMap(), _loading = new WeakMap();
@@ -24,7 +24,7 @@ class ErrorsFlow extends abstract_flow_1.AbstractFlow {
24
24
  this.emit('load', data);
25
25
  }
26
26
  }
27
- catch (error) {
27
+ catch {
28
28
  this.setLoading(false);
29
29
  this.complete();
30
30
  }
@@ -1,4 +1,3 @@
1
- /// <reference types="node" />
2
1
  import type { SelfServiceRegistrationFlow } from '@ory/kratos-client';
3
2
  import type { SelfServiceVerificationFlow } from '@ory/kratos-client';
4
3
  import type { SelfServiceRecoveryFlow } from '@ory/kratos-client';
@@ -11,23 +10,23 @@ import type { SubmitSelfServiceSettingsFlowBody } from '@ory/kratos-client';
11
10
  import type { SubmitSelfServiceLoginFlowBody } from '@ory/kratos-client';
12
11
  import type { UiText } from '@ory/kratos-client';
13
12
  import type { UiNode } from '@ory/kratos-client';
14
- import { EventEmitter } from 'events';
15
- export declare type FlowName = 'login' | 'registration' | 'recovery' | 'settings' | 'verification' | 'errors';
16
- export declare type SelfServiceFlow = SelfServiceRegistrationFlow | SelfServiceVerificationFlow | SelfServiceRecoveryFlow | SelfServiceSettingsFlow | SelfServiceLoginFlow;
17
- export declare type SubmitSelfServiceFlowBody = SubmitSelfServiceRegistrationFlowBody | SubmitSelfServiceVerificationFlowBody | SubmitSelfServiceRecoveryFlowBody | SubmitSelfServiceSettingsFlowBody | SubmitSelfServiceLoginFlowBody;
13
+ import type { EventEmitter } from 'events';
14
+ export type FlowName = 'errors' | 'login' | 'logout' | 'recovery' | 'registration' | 'settings' | 'verification';
15
+ export type SelfServiceFlow = SelfServiceLoginFlow | SelfServiceRecoveryFlow | SelfServiceRegistrationFlow | SelfServiceSettingsFlow | SelfServiceVerificationFlow;
16
+ export type SubmitSelfServiceFlowBody = SubmitSelfServiceLoginFlowBody | SubmitSelfServiceRecoveryFlowBody | SubmitSelfServiceRegistrationFlowBody | SubmitSelfServiceSettingsFlowBody | SubmitSelfServiceVerificationFlowBody;
18
17
  export interface Flow extends EventEmitter {
19
- setLoading(loading: boolean): any;
20
- isLoading(): any;
21
- setState(state: SelfServiceFlow): any;
22
- hasState(): any;
23
- getState(): SelfServiceFlow;
24
- getMessages(): Array<UiText>;
25
- getNode(name: string): UiNode | undefined;
26
- getNodes(name: string): Array<UiNode>;
27
- getNodesGroup(group: string): Array<UiNode>;
28
- getValue(name: any): string | any;
29
- setValue(name: string, value: string): any;
30
- getValues(): SubmitSelfServiceFlowBody;
31
- load(): Promise<void>;
32
- submit(method?: string): Promise<void>;
18
+ setLoading: (loading: boolean) => void;
19
+ isLoading: () => boolean;
20
+ setState: (state: SelfServiceFlow) => void;
21
+ hasState: () => boolean;
22
+ getState: () => SelfServiceFlow | undefined;
23
+ getMessages: () => Array<UiText>;
24
+ getNode: (name: string) => UiNode | undefined;
25
+ getNodes: (name: string) => Array<UiNode>;
26
+ getNodesGroup: (group: string) => Array<UiNode>;
27
+ getValue: (name: string) => any;
28
+ setValue: (name: string, value: string) => void;
29
+ getValues: () => SubmitSelfServiceFlowBody;
30
+ load: () => Promise<void>;
31
+ submit: (method?: string) => Promise<void>;
33
32
  }
@@ -1,7 +1,8 @@
1
- export * from './flow.interfaces';
1
+ export type * from './flow.interfaces';
2
2
  export * from './registration.flow';
3
3
  export * from './verification.flow';
4
4
  export * from './recovery.flow';
5
5
  export * from './settings.flow';
6
6
  export * from './errors.flow';
7
7
  export * from './login.flow';
8
+ export * from './logout.flow';
@@ -1,7 +1,11 @@
1
1
  "use strict";
2
2
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
3
  if (k2 === undefined) k2 = k;
4
- Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
5
9
  }) : (function(o, m, k, k2) {
6
10
  if (k2 === undefined) k2 = k;
7
11
  o[k2] = m[k];
@@ -10,10 +14,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
14
  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
15
  };
12
16
  Object.defineProperty(exports, "__esModule", { value: true });
13
- __exportStar(require("./flow.interfaces"), exports);
14
17
  __exportStar(require("./registration.flow"), exports);
15
18
  __exportStar(require("./verification.flow"), exports);
16
19
  __exportStar(require("./recovery.flow"), exports);
17
20
  __exportStar(require("./settings.flow"), exports);
18
21
  __exportStar(require("./errors.flow"), exports);
19
22
  __exportStar(require("./login.flow"), exports);
23
+ __exportStar(require("./logout.flow"), exports);
@@ -1,4 +1,4 @@
1
- import { V0alpha1Api } from '@ory/kratos-client';
2
- export declare class KratosClient extends V0alpha1Api {
1
+ import { V0alpha2Api } from '@ory/kratos-client';
2
+ export declare class KratosClient extends V0alpha2Api {
3
3
  constructor(basePath?: string);
4
4
  }
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.KratosClient = void 0;
4
4
  const kratos_client_1 = require("@ory/kratos-client");
5
5
  const kratos_client_2 = require("@ory/kratos-client");
6
- class KratosClient extends kratos_client_2.V0alpha1Api {
6
+ class KratosClient extends kratos_client_2.V0alpha2Api {
7
7
  constructor(basePath) {
8
8
  if (!basePath && typeof window !== 'undefined') {
9
9
  if (window.location.hostname === 'localhost') {
@@ -15,7 +15,7 @@ class LoginFlow extends abstract_flow_1.AbstractFlow {
15
15
  const flowId = new URL(window.location.href).searchParams.get('flow');
16
16
  const { data } = flowId
17
17
  ? await this.client.getSelfServiceLoginFlow(flowId, undefined, { withCredentials: true })
18
- : await this.client.initializeSelfServiceLoginFlowForBrowsers(false, {
18
+ : await this.client.initializeSelfServiceLoginFlowForBrowsers(false, undefined, undefined, {
19
19
  withCredentials: true,
20
20
  });
21
21
  this.setLoading(false);
@@ -39,12 +39,13 @@ class LoginFlow extends abstract_flow_1.AbstractFlow {
39
39
  }
40
40
  }
41
41
  async submit(method) {
42
+ const state = this.requireState();
42
43
  const body = this.getValues();
43
44
  if (method) {
44
45
  body.method = method;
45
46
  }
46
47
  try {
47
- await this.client.submitSelfServiceLoginFlow(this.getState().id, body, {
48
+ await this.client.submitSelfServiceLoginFlow(state.id, undefined, body, {
48
49
  withCredentials: true,
49
50
  });
50
51
  this.complete();
@@ -0,0 +1,5 @@
1
+ import { AbstractFlow } from './abstract.flow';
2
+ export declare class LogoutFlow extends AbstractFlow<any, any> {
3
+ load(): Promise<void>;
4
+ submit(): Promise<void>;
5
+ }
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.LogoutFlow = void 0;
4
+ const abstract_flow_1 = require("./abstract.flow");
5
+ class LogoutFlow extends abstract_flow_1.AbstractFlow {
6
+ async load() {
7
+ if (typeof window === 'undefined') {
8
+ return;
9
+ }
10
+ if (this.hasState() || this.isLoading()) {
11
+ return;
12
+ }
13
+ this.setLoading(true);
14
+ const { data } = await this.client.createSelfServiceLogoutFlowUrlForBrowsers(undefined, {
15
+ withCredentials: true,
16
+ });
17
+ await this.client.submitSelfServiceLogoutFlow(data.logout_token);
18
+ this.setLoading(false);
19
+ }
20
+ async submit() { }
21
+ }
22
+ exports.LogoutFlow = LogoutFlow;
@@ -17,7 +17,7 @@ class RecoveryFlow extends abstract_flow_1.AbstractFlow {
17
17
  ? await this.client.getSelfServiceRecoveryFlow(flowId, undefined, {
18
18
  withCredentials: true,
19
19
  })
20
- : await this.client.initializeSelfServiceRecoveryFlowForBrowsers({
20
+ : await this.client.initializeSelfServiceRecoveryFlowForBrowsers(undefined, {
21
21
  withCredentials: true,
22
22
  });
23
23
  this.setLoading(false);
@@ -44,12 +44,13 @@ class RecoveryFlow extends abstract_flow_1.AbstractFlow {
44
44
  }
45
45
  }
46
46
  async submit(method) {
47
+ const state = this.requireState();
47
48
  const body = this.getValues();
48
49
  if (method) {
49
50
  body.method = method;
50
51
  }
51
52
  try {
52
- const { data } = await this.client.submitSelfServiceRecoveryFlow(this.getState().id, undefined, body, {
53
+ const { data } = await this.client.submitSelfServiceRecoveryFlow(state.id, undefined, body, {
53
54
  withCredentials: true,
54
55
  });
55
56
  this.setState(data);
@@ -17,7 +17,7 @@ class RegistrationFlow extends abstract_flow_1.AbstractFlow {
17
17
  ? await this.client.getSelfServiceRegistrationFlow(flowId, undefined, {
18
18
  withCredentials: true,
19
19
  })
20
- : await this.client.initializeSelfServiceRegistrationFlowForBrowsers({
20
+ : await this.client.initializeSelfServiceRegistrationFlowForBrowsers(undefined, {
21
21
  withCredentials: true,
22
22
  });
23
23
  this.setLoading(false);
@@ -44,12 +44,13 @@ class RegistrationFlow extends abstract_flow_1.AbstractFlow {
44
44
  }
45
45
  }
46
46
  async submit(method) {
47
+ const state = this.requireState();
47
48
  const body = this.getValues();
48
49
  if (method) {
49
50
  body.method = method;
50
51
  }
51
52
  try {
52
- await this.client.submitSelfServiceRegistrationFlow(this.getState().id, body, {
53
+ await this.client.submitSelfServiceRegistrationFlow(state.id, body, {
53
54
  withCredentials: true,
54
55
  });
55
56
  this.complete();
@@ -42,17 +42,18 @@ class SettingsFlow extends abstract_flow_1.AbstractFlow {
42
42
  }
43
43
  }
44
44
  async submit(method) {
45
+ const state = this.requireState();
45
46
  const body = this.getValues();
46
47
  if (method) {
47
48
  body.method = method;
48
49
  }
49
50
  try {
50
- const { data } = await this.client.submitSelfServiceSettingsFlow(this.getState().id, undefined, body, {
51
+ const { data } = await this.client.submitSelfServiceSettingsFlow(state.id, undefined, body, {
51
52
  withCredentials: true,
52
53
  });
53
- this.setState(data.flow);
54
- this.setValues(data.flow);
55
- this.emit('load', data.flow);
54
+ this.setState(data);
55
+ this.setValues(data);
56
+ this.emit('load', data);
56
57
  }
57
58
  catch (error) {
58
59
  const { data, status } = error
@@ -17,7 +17,7 @@ class VerificationFlow extends abstract_flow_1.AbstractFlow {
17
17
  ? await this.client.getSelfServiceVerificationFlow(flowId, undefined, {
18
18
  withCredentials: true,
19
19
  })
20
- : await this.client.initializeSelfServiceVerificationFlowForBrowsers({
20
+ : await this.client.initializeSelfServiceVerificationFlowForBrowsers(undefined, {
21
21
  withCredentials: true,
22
22
  });
23
23
  this.setLoading(false);
@@ -42,12 +42,13 @@ class VerificationFlow extends abstract_flow_1.AbstractFlow {
42
42
  }
43
43
  }
44
44
  async submit(method) {
45
+ const state = this.requireState();
45
46
  const body = this.getValues();
46
47
  if (method) {
47
48
  body.method = method;
48
49
  }
49
50
  try {
50
- const { data } = await this.client.submitSelfServiceVerificationFlow(this.getState().id, undefined, body, {
51
+ const { data } = await this.client.submitSelfServiceVerificationFlow(state.id, undefined, body, {
51
52
  withCredentials: true,
52
53
  });
53
54
  this.setState(data);
package/dist/index.js CHANGED
@@ -1,7 +1,11 @@
1
1
  "use strict";
2
2
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
3
  if (k2 === undefined) k2 = k;
4
- Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
5
9
  }) : (function(o, m, k, k2) {
6
10
  if (k2 === undefined) k2 = k;
7
11
  o[k2] = m[k];
@@ -1,3 +1,3 @@
1
- import { Flow } from '../flows/flow.interfaces';
1
+ import type { Flow } from '../flows/flow.interfaces';
2
2
  export declare const Context: import("react").Context<Flow | null>;
3
3
  export declare const Provider: import("react").Provider<Flow | null>, Consumer: import("react").Consumer<Flow | null>;
@@ -2,5 +2,5 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Consumer = exports.Provider = exports.Context = void 0;
4
4
  const react_1 = require("react");
5
- exports.Context = react_1.createContext(null);
5
+ exports.Context = (0, react_1.createContext)(null);
6
6
  exports.Provider = exports.Context.Provider, exports.Consumer = exports.Context.Consumer;
@@ -3,6 +3,7 @@ export * from './kratos-verification-flow.provider';
3
3
  export * from './kratos-recovery-flow.provider';
4
4
  export * from './kratos-settings-flow.provider';
5
5
  export * from './kratos-errors-flow.provider';
6
+ export * from './kraots-logout-flow.provider';
6
7
  export * from './kratos-login-flow.provider';
7
8
  export * from './kratos-flow.provider';
8
9
  export * from './use-flow.hook';
@@ -1,7 +1,11 @@
1
1
  "use strict";
2
2
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
3
  if (k2 === undefined) k2 = k;
4
- Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
5
9
  }) : (function(o, m, k, k2) {
6
10
  if (k2 === undefined) k2 = k;
7
11
  o[k2] = m[k];
@@ -15,6 +19,7 @@ __exportStar(require("./kratos-verification-flow.provider"), exports);
15
19
  __exportStar(require("./kratos-recovery-flow.provider"), exports);
16
20
  __exportStar(require("./kratos-settings-flow.provider"), exports);
17
21
  __exportStar(require("./kratos-errors-flow.provider"), exports);
22
+ __exportStar(require("./kraots-logout-flow.provider"), exports);
18
23
  __exportStar(require("./kratos-login-flow.provider"), exports);
19
24
  __exportStar(require("./kratos-flow.provider"), exports);
20
25
  __exportStar(require("./use-flow.hook"), exports);
@@ -0,0 +1,3 @@
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosLogoutFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.KratosLogoutFlowProvider = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const kratos_flow_provider_1 = require("./kratos-flow.provider");
6
+ const KratosLogoutFlowProvider = (props) => ((0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'logout' }));
7
+ exports.KratosLogoutFlowProvider = KratosLogoutFlowProvider;
@@ -1 +1,3 @@
1
- export declare const KratosErrorsFlowProvider: (props: any) => JSX.Element;
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosErrorsFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosErrorsFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const kratos_flow_provider_1 = require("./kratos-flow.provider");
9
- const KratosErrorsFlowProvider = (props) => react_1.default.createElement(kratos_flow_provider_1.KratosFlowProvider, Object.assign({}, props, { name: 'errors' }));
6
+ const KratosErrorsFlowProvider = (props) => ((0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'errors' }));
10
7
  exports.KratosErrorsFlowProvider = KratosErrorsFlowProvider;
@@ -1,7 +1,9 @@
1
- import { FC } from 'react';
2
- import { FlowName } from '../flows/flow.interfaces';
1
+ import type { ReactNode } from 'react';
2
+ import type { FC } from 'react';
3
+ import type { FlowName } from '../flows/flow.interfaces';
3
4
  export interface KratosFlowProviderProps {
4
5
  basePath?: string;
5
6
  name: FlowName;
7
+ children: Array<ReactNode> | ReactNode;
6
8
  }
7
9
  export declare const KratosFlowProvider: FC<KratosFlowProviderProps>;
@@ -1,42 +1,39 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
8
- const react_2 = require("react");
9
- const registration_flow_1 = require("../flows/registration.flow");
10
- const verification_flow_1 = require("../flows/verification.flow");
11
- const recovery_flow_1 = require("../flows/recovery.flow");
12
- const settings_flow_1 = require("../flows/settings.flow");
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
13
6
  const errors_flow_1 = require("../flows/errors.flow");
14
- const login_flow_1 = require("../flows/login.flow");
15
7
  const kratos_client_1 = require("../flows/kratos.client");
8
+ const login_flow_1 = require("../flows/login.flow");
9
+ const logout_flow_1 = require("../flows/logout.flow");
10
+ const recovery_flow_1 = require("../flows/recovery.flow");
11
+ const registration_flow_1 = require("../flows/registration.flow");
12
+ const settings_flow_1 = require("../flows/settings.flow");
13
+ const verification_flow_1 = require("../flows/verification.flow");
16
14
  const flows_context_1 = require("./flows.context");
17
- const KratosFlowProvider = ({ name, basePath, children }) => {
18
- const client = react_2.useMemo(() => new kratos_client_1.KratosClient(basePath), [basePath]);
19
- const flow = react_2.useMemo(() => {
20
- if (name === 'login') {
21
- return new login_flow_1.LoginFlow(client);
22
- }
23
- if (name === 'registration') {
24
- return new registration_flow_1.RegistrationFlow(client);
25
- }
26
- if (name === 'verification') {
27
- return new verification_flow_1.VerificationFlow(client);
28
- }
29
- if (name === 'recovery') {
30
- return new recovery_flow_1.RecoveryFlow(client);
31
- }
32
- if (name === 'settings') {
33
- return new settings_flow_1.SettingsFlow(client);
34
- }
35
- if (name === 'errors') {
36
- return new errors_flow_1.ErrorsFlow(client);
15
+ const KratosFlowProvider = ({ name, basePath, children, }) => {
16
+ const client = (0, react_1.useMemo)(() => new kratos_client_1.KratosClient(basePath), [basePath]);
17
+ const flow = (0, react_1.useMemo)(() => {
18
+ switch (name) {
19
+ case 'login':
20
+ return new login_flow_1.LoginFlow(client);
21
+ case 'registration':
22
+ return new registration_flow_1.RegistrationFlow(client);
23
+ case 'verification':
24
+ return new verification_flow_1.VerificationFlow(client);
25
+ case 'recovery':
26
+ return new recovery_flow_1.RecoveryFlow(client);
27
+ case 'settings':
28
+ return new settings_flow_1.SettingsFlow(client);
29
+ case 'errors':
30
+ return new errors_flow_1.ErrorsFlow(client);
31
+ case 'logout':
32
+ return new logout_flow_1.LogoutFlow(client);
33
+ default:
34
+ throw new Error(`Unkown flow: ${name}`);
37
35
  }
38
- throw new Error(`Unkown flow: ${name}`);
39
36
  }, [name, client]);
40
- return react_1.default.createElement(flows_context_1.Provider, { value: flow }, children);
37
+ return (0, jsx_runtime_1.jsx)(flows_context_1.Provider, { value: flow, children: children });
41
38
  };
42
39
  exports.KratosFlowProvider = KratosFlowProvider;
@@ -1 +1,3 @@
1
- export declare const KratosLoginFlowProvider: (props: any) => JSX.Element;
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosLoginFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosLoginFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const kratos_flow_provider_1 = require("./kratos-flow.provider");
9
- const KratosLoginFlowProvider = (props) => react_1.default.createElement(kratos_flow_provider_1.KratosFlowProvider, Object.assign({}, props, { name: 'login' }));
6
+ const KratosLoginFlowProvider = (props) => ((0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'login' }));
10
7
  exports.KratosLoginFlowProvider = KratosLoginFlowProvider;
@@ -1 +1,3 @@
1
- export declare const KratosRecoveryFlowProvider: (props: any) => JSX.Element;
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosRecoveryFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosRecoveryFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const kratos_flow_provider_1 = require("./kratos-flow.provider");
9
- const KratosRecoveryFlowProvider = (props) => (react_1.default.createElement(kratos_flow_provider_1.KratosFlowProvider, Object.assign({}, props, { name: 'recovery' })));
6
+ const KratosRecoveryFlowProvider = (props) => ((0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'recovery' }));
10
7
  exports.KratosRecoveryFlowProvider = KratosRecoveryFlowProvider;
@@ -1 +1,3 @@
1
- export declare const KratosRegistrationFlowProvider: (props: any) => JSX.Element;
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosRegistrationFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosRegistrationFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const kratos_flow_provider_1 = require("./kratos-flow.provider");
9
- const KratosRegistrationFlowProvider = (props) => (react_1.default.createElement(kratos_flow_provider_1.KratosFlowProvider, Object.assign({}, props, { name: 'registration' })));
6
+ const KratosRegistrationFlowProvider = (props) => (0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'registration' });
10
7
  exports.KratosRegistrationFlowProvider = KratosRegistrationFlowProvider;
@@ -1 +1,3 @@
1
- export declare const KratosSettingsFlowProvider: (props: any) => JSX.Element;
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosSettingsFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosSettingsFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const kratos_flow_provider_1 = require("./kratos-flow.provider");
9
- const KratosSettingsFlowProvider = (props) => (react_1.default.createElement(kratos_flow_provider_1.KratosFlowProvider, Object.assign({}, props, { name: 'settings' })));
6
+ const KratosSettingsFlowProvider = (props) => ((0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'settings' }));
10
7
  exports.KratosSettingsFlowProvider = KratosSettingsFlowProvider;
@@ -1 +1,3 @@
1
- export declare const KratosVerificationFlowProvider: (props: any) => JSX.Element;
1
+ import type { FC } from 'react';
2
+ import type { KratosFlowProviderProps } from './kratos-flow.provider';
3
+ export declare const KratosVerificationFlowProvider: FC<Omit<KratosFlowProviderProps, 'name'>>;
@@ -1,10 +1,7 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
3
  exports.KratosVerificationFlowProvider = void 0;
7
- const react_1 = __importDefault(require("react"));
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
8
5
  const kratos_flow_provider_1 = require("./kratos-flow.provider");
9
- const KratosVerificationFlowProvider = (props) => (react_1.default.createElement(kratos_flow_provider_1.KratosFlowProvider, Object.assign({}, props, { name: 'verification' })));
6
+ const KratosVerificationFlowProvider = (props) => (0, jsx_runtime_1.jsx)(kratos_flow_provider_1.KratosFlowProvider, { ...props, name: 'verification' });
10
7
  exports.KratosVerificationFlowProvider = KratosVerificationFlowProvider;
@@ -1,2 +1,2 @@
1
- import { Flow } from '../flows/flow.interfaces';
1
+ import type { Flow } from '../flows/flow.interfaces';
2
2
  export declare const useFlow: () => Flow;
@@ -6,12 +6,12 @@ const react_2 = require("react");
6
6
  const react_3 = require("react");
7
7
  const flows_context_1 = require("./flows.context");
8
8
  const useFlow = () => {
9
- const flow = react_1.useContext(flows_context_1.Context);
9
+ const flow = (0, react_1.useContext)(flows_context_1.Context);
10
10
  if (!flow) {
11
11
  throw new Error('Missing <KratosFlowProvider>');
12
12
  }
13
- const [, setState] = react_3.useState(null);
14
- react_2.useEffect(() => {
13
+ const [state, setState] = (0, react_3.useState)(null);
14
+ (0, react_2.useEffect)(() => {
15
15
  flow.load();
16
16
  const callback = (flowState) => {
17
17
  setState(flowState);
@@ -1,5 +1,5 @@
1
- import { ReactElement } from 'react';
2
- import { FC } from 'react';
1
+ import type { ReactElement } from 'react';
2
+ import type { FC } from 'react';
3
3
  interface SelfServiceErrorProps {
4
4
  code?: number;
5
5
  status?: string;
@@ -7,7 +7,7 @@ interface SelfServiceErrorProps {
7
7
  message?: string;
8
8
  }
9
9
  export interface FlowErrorProps {
10
- children: (error: SelfServiceErrorProps) => ReactElement<any>;
10
+ children: (error: SelfServiceErrorProps) => ReactElement;
11
11
  }
12
12
  export declare const FlowError: FC<FlowErrorProps>;
13
13
  export {};
@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.FlowError = void 0;
4
4
  const providers_1 = require("../providers");
5
5
  const FlowError = ({ children }) => {
6
- const flow = providers_1.useFlow();
6
+ const flow = (0, providers_1.useFlow)();
7
7
  const state = flow.getState();
8
- if (typeof children === 'function' && (state === null || state === void 0 ? void 0 : state.error)) {
8
+ if (typeof children === 'function' && state?.error) {
9
9
  return children(state.error);
10
10
  }
11
11
  return null;
@@ -1,4 +1,6 @@
1
- export declare const FlowForm: ({ children, ...props }: {
2
- [x: string]: any;
3
- children: any;
4
- }) => JSX.Element | null;
1
+ import type { PropsWithChildren } from 'react';
2
+ import type { HTMLAttributes } from 'react';
3
+ import type { FC } from 'react';
4
+ export interface FlowFormProps extends HTMLAttributes<HTMLFormElement> {
5
+ }
6
+ export declare const FlowForm: FC<PropsWithChildren<FlowFormProps>>;
@@ -1,30 +1,15 @@
1
1
  "use strict";
2
- var __rest = (this && this.__rest) || function (s, e) {
3
- var t = {};
4
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
- t[p] = s[p];
6
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
- t[p[i]] = s[p[i]];
10
- }
11
- return t;
12
- };
13
- var __importDefault = (this && this.__importDefault) || function (mod) {
14
- return (mod && mod.__esModule) ? mod : { "default": mod };
15
- };
16
2
  Object.defineProperty(exports, "__esModule", { value: true });
17
3
  exports.FlowForm = void 0;
18
- const react_1 = __importDefault(require("react"));
19
- const react_2 = require("react");
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
20
6
  const providers_1 = require("../providers");
21
- const FlowForm = (_a) => {
22
- var { children } = _a, props = __rest(_a, ["children"]);
23
- const flow = providers_1.useFlow();
24
- const ui = react_2.useMemo(() => { var _a; return (_a = flow.getState()) === null || _a === void 0 ? void 0 : _a.ui; }, [flow.getState()]);
7
+ const FlowForm = ({ children, ...props }) => {
8
+ const flow = (0, providers_1.useFlow)();
9
+ const ui = (0, react_1.useMemo)(() => flow.getState()?.ui, [flow.getState()]);
25
10
  if (!ui) {
26
11
  return null;
27
12
  }
28
- return (react_1.default.createElement("form", Object.assign({}, props, { action: ui.action, method: ui.method }), children));
13
+ return ((0, jsx_runtime_1.jsx)("form", { ...props, action: ui.action, method: ui.method, children: children }));
29
14
  };
30
15
  exports.FlowForm = FlowForm;
@@ -1,7 +1,7 @@
1
- import { UiText } from '@ory/kratos-client';
2
- import { ReactElement } from 'react';
3
- import { FC } from 'react';
1
+ import type { UiText } from '@ory/kratos-client';
2
+ import type { ReactElement } from 'react';
3
+ import type { FC } from 'react';
4
4
  export interface FlowMessagesProps {
5
- children: (messages: Array<UiText>) => ReactElement<any>;
5
+ children: (messages: Array<UiText>) => ReactElement;
6
6
  }
7
7
  export declare const FlowMessages: FC<FlowMessagesProps>;
@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.FlowMessages = void 0;
4
4
  const providers_1 = require("../providers");
5
5
  const FlowMessages = ({ children }) => {
6
- const flow = providers_1.useFlow();
6
+ const flow = (0, providers_1.useFlow)();
7
7
  const messages = flow.getMessages();
8
- if (typeof children === 'function' && messages) {
8
+ if (typeof children === 'function') {
9
9
  return children(messages);
10
10
  }
11
11
  return null;
@@ -1,8 +1,8 @@
1
- import { UiText } from '@ory/kratos-client';
2
- import { ReactElement } from 'react';
3
- import { FC } from 'react';
1
+ import type { UiText } from '@ory/kratos-client';
2
+ import type { ReactElement } from 'react';
3
+ import type { FC } from 'react';
4
4
  export interface FlowNodeMessagesProps {
5
5
  name: string;
6
- children: (messages: Array<UiText>) => ReactElement<any>;
6
+ children: (messages: Array<UiText>) => ReactElement;
7
7
  }
8
8
  export declare const FlowNodeMessages: FC<FlowNodeMessagesProps>;
@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.FlowNodeMessages = void 0;
4
4
  const providers_1 = require("../providers");
5
5
  const FlowNodeMessages = ({ name, children }) => {
6
- const flow = providers_1.useFlow();
6
+ const flow = (0, providers_1.useFlow)();
7
7
  const node = flow.getNode(name);
8
- if (typeof children === 'function' && (node === null || node === void 0 ? void 0 : node.messages)) {
8
+ if (typeof children === 'function' && node?.messages) {
9
9
  return children(node.messages);
10
10
  }
11
11
  return null;
@@ -1,23 +1,11 @@
1
- import { UiNode } from '@ory/kratos-client';
2
- import { ReactElement } from 'react';
3
- import { FC } from 'react';
4
- import { FormEvent } from 'react';
5
- interface FlowUiNodeAttributes {
6
- disabled: boolean;
7
- name: string;
8
- pattern?: string;
9
- required?: boolean;
10
- type: string;
11
- value?: any | null;
12
- src: string;
13
- }
14
- interface FlowUiNode extends Omit<UiNode, 'attributes'> {
15
- attributes: FlowUiNodeAttributes;
16
- }
17
- declare type OnChangeCallback = (event: FormEvent<HTMLInputElement> | string | any) => void;
1
+ import type { UiNode } from '@ory/kratos-client';
2
+ import type { ReactElement } from 'react';
3
+ import type { FC } from 'react';
4
+ import type { FormEvent } from 'react';
5
+ type OnChangeCallback = (event: string | FormEvent<HTMLInputElement>) => void;
18
6
  export interface FlowNodeProps {
19
7
  name: string;
20
- children: (node: FlowUiNode, value: string | any, callback: OnChangeCallback) => ReactElement<any>;
8
+ children: (node: UiNode, value: any, callback: OnChangeCallback) => ReactElement;
21
9
  }
22
10
  export declare const FlowNode: FC<FlowNodeProps>;
23
11
  export {};
@@ -6,11 +6,11 @@ const react_2 = require("react");
6
6
  const react_3 = require("react");
7
7
  const providers_1 = require("../providers");
8
8
  const FlowNode = ({ name, children }) => {
9
- const flow = providers_1.useFlow();
10
- const node = react_1.useMemo(() => flow.getNode(name), [name, flow, flow.getState()]);
11
- const [value = '', setValue] = react_2.useState(flow.getValue(name));
12
- const onChange = react_3.useCallback((event) => {
13
- if (event && event.target) {
9
+ const flow = (0, providers_1.useFlow)();
10
+ const node = (0, react_1.useMemo)(() => flow.getNode(name), [name, flow, flow.getState()]);
11
+ const [value = '', setValue] = (0, react_2.useState)(flow.getValue(name));
12
+ const onChange = (0, react_3.useCallback)((event) => {
13
+ if (typeof event === 'object' && 'value' in event.target && event.target.value) {
14
14
  setValue(event.target.value);
15
15
  flow.setValue(name, event.target.value);
16
16
  }
@@ -1,21 +1,8 @@
1
- import { UiNode } from '@ory/kratos-client';
2
- import { ReactElement } from 'react';
3
- import { FC } from 'react';
4
- interface FlowUiNodeAttributes {
5
- disabled: boolean;
6
- name: string;
7
- pattern?: string;
8
- required?: boolean;
9
- type: string;
10
- value?: any | null;
11
- src: string;
12
- }
13
- interface FlowUiNode extends Omit<UiNode, 'attributes'> {
14
- attributes: FlowUiNodeAttributes;
15
- }
1
+ import type { UiNode } from '@ory/kratos-client';
2
+ import type { ReactElement } from 'react';
3
+ import type { FC } from 'react';
16
4
  export interface FlowNodesGroupProps {
17
5
  name: string;
18
- children: (node: Array<FlowUiNode>) => ReactElement<any>;
6
+ children: (node: Array<UiNode>) => ReactElement;
19
7
  }
20
8
  export declare const FlowNodesGroup: FC<FlowNodesGroupProps>;
21
- export {};
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.FlowNodesGroup = void 0;
4
4
  const providers_1 = require("../providers");
5
5
  const FlowNodesGroup = ({ name, children }) => {
6
- const flow = providers_1.useFlow();
6
+ const flow = (0, providers_1.useFlow)();
7
7
  const nodes = flow.getNodesGroup(name);
8
8
  if (typeof children === 'function') {
9
9
  return children(nodes);
@@ -1,4 +1,8 @@
1
- export declare const FlowSubmit: ({ method, children }: {
2
- method: any;
3
- children: any;
4
- }) => any;
1
+ import type { ReactElement } from 'react';
2
+ import type { FC } from 'react';
3
+ import type { ReactNode } from 'react';
4
+ export interface FlowSubmitProps {
5
+ method: string;
6
+ children: (submit: (method: string) => void) => ReactElement | ReactNode | null;
7
+ }
8
+ export declare const FlowSubmit: FC<FlowSubmitProps>;
@@ -5,12 +5,12 @@ const react_1 = require("react");
5
5
  const react_2 = require("react");
6
6
  const providers_1 = require("../providers");
7
7
  const FlowSubmit = ({ method, children }) => {
8
- const flow = providers_1.useFlow();
8
+ const flow = (0, providers_1.useFlow)();
9
9
  if (typeof children === 'function') {
10
- return children((mtd) => flow.submit(mtd));
10
+ return children(async (mtd) => flow.submit(mtd));
11
11
  }
12
- if (react_1.isValidElement(children)) {
13
- return react_2.cloneElement(children, {
12
+ if ((0, react_1.isValidElement)(children)) {
13
+ return (0, react_2.cloneElement)(children, {
14
14
  onClick: () => {
15
15
  flow.submit(method);
16
16
  },
package/dist/ui/index.js CHANGED
@@ -1,7 +1,11 @@
1
1
  "use strict";
2
2
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
3
  if (k2 === undefined) k2 = k;
4
- Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
5
9
  }) : (function(o, m, k, k2) {
6
10
  if (k2 === undefined) k2 = k;
7
11
  o[k2] = m[k];
package/package.json CHANGED
@@ -1,26 +1,27 @@
1
1
  {
2
2
  "name": "@atls/react-kratos-browser-flows",
3
- "version": "0.0.1",
3
+ "version": "0.1.0",
4
4
  "license": "BSD-3-Clause",
5
5
  "main": "dist/index.js",
6
6
  "files": [
7
7
  "dist"
8
8
  ],
9
9
  "scripts": {
10
- "build": "yarn app library build",
11
- "postpack": "rm -rf dist",
12
- "prepack": "yarn run build"
10
+ "build": "yarn library build",
11
+ "prepack": "yarn run build",
12
+ "postpack": "rm -rf dist"
13
+ },
14
+ "dependencies": {
15
+ "@ory/kratos-client": "^0.8.2-alpha.1",
16
+ "events": "3.3.0"
13
17
  },
14
18
  "devDependencies": {
15
- "@testing-library/jest-dom": "^5.14.1",
16
- "@testing-library/react": "^12.1.0",
17
- "@types/events": "^3.0.0",
18
- "@types/react": "^17.0.20",
19
- "@types/react-dom": "^17.0.9",
20
- "@types/testing-library__jest-dom": "^5.14.1",
21
- "axios": "^0.21.4",
22
- "react": "^17.0.2",
23
- "react-dom": "^17.0.2"
19
+ "@types/events": "3.0.3",
20
+ "@types/react": "18.3.6",
21
+ "@types/react-dom": "18.2.7",
22
+ "axios": "1.7.7",
23
+ "react": "18.3.1",
24
+ "react-dom": "18.3.1"
24
25
  },
25
26
  "peerDependencies": {
26
27
  "react": "^17.0.1"
@@ -30,9 +31,5 @@
30
31
  "main": "dist/index.js",
31
32
  "typings": "dist/index.d.ts"
32
33
  },
33
- "dependencies": {
34
- "@ory/kratos-client": "^0.7.6-alpha.1",
35
- "events": "^3.3.0"
36
- },
37
34
  "typings": "dist/index.d.ts"
38
35
  }