diff --git a/packages/sdks/angular-sdk/README.md b/packages/sdks/angular-sdk/README.md index ca41aceb2..ff3d1ddf7 100644 --- a/packages/sdks/angular-sdk/README.md +++ b/packages/sdks/angular-sdk/README.md @@ -148,6 +148,14 @@ export class AppComponent { - "skipFirstScreen": automatically focus on the first input of each screen, except first screen autoFocus="skipFirstScreen" + validateOnBlur can be true or false. Default is false. + - true: Trigger input validation upon blur, in addition to the validation on submit + - false: do not trigger input validation upon blur + + restartOnError can be true or false. Default is false. + - true: In case of flow version mismatch, will restart the flow if the components version was not changed + - false: Will not auto restart the flow in case of a flow version mismatch + errorTransformer is a function that receives an error object and returns a string. The returned string will be displayed to the user. NOTE: errorTransformer is not required. If not provided, the error object will be displayed as is. Example: diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/descope/descope.component.ts b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/descope/descope.component.ts index b22e1dbce..f3f1604b5 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/descope/descope.component.ts +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/descope/descope.component.ts @@ -32,6 +32,8 @@ export class DescopeComponent implements OnInit, OnChanges { @Input() telemetryKey: string; @Input() redirectUrl: string; @Input() autoFocus: true | false | 'skipFirstScreen'; + @Input() validateOnBlur: boolean; + @Input() restartOnError: boolean; @Input() debug: boolean; @Input() errorTransformer: (error: { text: string; type: string }) => string; @@ -123,6 +125,12 @@ export class DescopeComponent implements OnInit, OnChanges { if (this.autoFocus) { this.webComponent.setAttribute('auto-focus', this.autoFocus.toString()); } + if (this.validateOnBlur) { + this.webComponent.setAttribute('validate-on-blur', this.autoFocus.toString()); + } + if (this.restartOnError) { + this.webComponent.setAttribute('restart-on-error', this.autoFocus.toString()); + } if (this.debug) { this.webComponent.setAttribute('debug', this.debug.toString()); } diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.html b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.html index 8d3105b87..d2483e87f 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.html +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.html @@ -8,6 +8,8 @@ [telemetryKey]="telemetryKey" [redirectUrl]="redirectUrl" [autoFocus]="autoFocus" + [validateOnBlur]="validateOnBlur" + [restartOnError]="restartOnError" [debug]="debug" [errorTransformer]="errorTransformer" [client]="client" diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.ts b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.ts index 9d059cf4f..ff5eb3f81 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.ts +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-in-flow/sign-in-flow.component.ts @@ -18,7 +18,9 @@ export class SignInFlowComponent { @Input() telemetryKey: string; @Input() redirectUrl: string; @Input() autoFocus: true | false | 'skipFirstScreen'; - + @Input() validateOnBlur: boolean; + @Input() restartOnError: boolean; + @Input() debug: boolean; @Input() errorTransformer: (error: { text: string; type: string }) => string; @Input() client: Record; diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.html b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.html index 7bdb384b1..31eaeb775 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.html +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.html @@ -8,6 +8,8 @@ [telemetryKey]="telemetryKey" [redirectUrl]="redirectUrl" [autoFocus]="autoFocus" + [validateOnBlur]="validateOnBlur" + [restartOnError]="restartOnError" [debug]="debug" [errorTransformer]="errorTransformer" [client]="client" diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.ts b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.ts index c477a3eea..0dff55933 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.ts +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-flow/sign-up-flow.component.ts @@ -18,7 +18,9 @@ export class SignUpFlowComponent { @Input() telemetryKey: string; @Input() redirectUrl: string; @Input() autoFocus: true | false | 'skipFirstScreen'; - + @Input() validateOnBlur: boolean; + @Input() restartOnError: boolean; + @Input() debug: boolean; @Input() errorTransformer: (error: { text: string; type: string }) => string; @Input() client: Record; diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.html b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.html index 923ef24e3..14dc176e1 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.html +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.html @@ -8,6 +8,8 @@ [telemetryKey]="telemetryKey" [redirectUrl]="redirectUrl" [autoFocus]="autoFocus" + [validateOnBlur]="validateOnBlur" + [restartOnError]="restartOnError" [debug]="debug" [errorTransformer]="errorTransformer" [client]="client" diff --git a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.ts b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.ts index a14063009..a15624a48 100644 --- a/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.ts +++ b/packages/sdks/angular-sdk/projects/angular-sdk/src/lib/components/sign-up-or-in-flow/sign-up-or-in-flow.component.ts @@ -18,7 +18,9 @@ export class SignUpOrInFlowComponent { @Input() telemetryKey: string; @Input() redirectUrl: string; @Input() autoFocus: true | false | 'skipFirstScreen'; - + @Input() validateOnBlur: boolean; + @Input() restartOnError: boolean; + @Input() debug: boolean; @Input() errorTransformer: (error: { text: string; type: string }) => string; @Input() client: Record; diff --git a/packages/sdks/react-sdk/README.md b/packages/sdks/react-sdk/README.md index d64e6d9ed..c080de616 100644 --- a/packages/sdks/react-sdk/README.md +++ b/packages/sdks/react-sdk/README.md @@ -99,7 +99,9 @@ const App = () => { // - "skipFirstScreen": automatically focus on the first input of each screen, except first screen // autoFocus="skipFirstScreen" - // validateOnBlur: set it to true will show input validation errors on blur, in addition to on submit + // validateOnBlur: set it to true will show input validation errors on blur, in addition to on submit + + // restartOnError: if set to true, in case of flow version mismatch, will restart the flow if the components version was not changed. Default is false // errorTransformer is a function that receives an error object and returns a string. The returned string will be displayed to the user. // NOTE: errorTransformer is not required. If not provided, the error object will be displayed as is. diff --git a/packages/sdks/react-sdk/src/components/Descope.tsx b/packages/sdks/react-sdk/src/components/Descope.tsx index 4484c0ae3..62618de7e 100644 --- a/packages/sdks/react-sdk/src/components/Descope.tsx +++ b/packages/sdks/react-sdk/src/components/Descope.tsx @@ -53,6 +53,7 @@ const DescopeWC = lazy(async () => { styleId, autoFocus, validateOnBlur, + restartOnError, storeLastAuthenticatedUser, }) => ( { redirect-url={redirectUrl} auto-focus={autoFocus} validate-on-blur={validateOnBlur} + restart-on-error={restartOnError} store-last-authenticated-user={storeLastAuthenticatedUser} /> ), @@ -95,6 +97,7 @@ const Descope = React.forwardRef( redirectUrl, autoFocus, validateOnBlur, + restartOnError, errorTransformer, styleId, }, @@ -217,6 +220,7 @@ const Descope = React.forwardRef( autoFocus={autoFocus} styleId={styleId} validateOnBlur={validateOnBlur} + restartOnError={restartOnError} storeLastAuthenticatedUser={storeLastAuthenticatedUser} keepLastAuthenticatedUserAfterLogout={ keepLastAuthenticatedUserAfterLogout diff --git a/packages/sdks/react-sdk/src/types.ts b/packages/sdks/react-sdk/src/types.ts index 605c71477..5e9e431b9 100644 --- a/packages/sdks/react-sdk/src/types.ts +++ b/packages/sdks/react-sdk/src/types.ts @@ -117,6 +117,7 @@ export type DescopeProps = { locale?: string; autoFocus?: AutoFocusOptions; validateOnBlur?: boolean; + restartOnError?: boolean; debug?: boolean; telemetryKey?: string; redirectUrl?: string; diff --git a/packages/sdks/vue-sdk/README.md b/packages/sdks/vue-sdk/README.md index 786f57319..4c6fc2740 100644 --- a/packages/sdks/vue-sdk/README.md +++ b/packages/sdks/vue-sdk/README.md @@ -50,6 +50,7 @@ app.mount('#app'); + diff --git a/packages/sdks/vue-sdk/src/Descope.vue b/packages/sdks/vue-sdk/src/Descope.vue index 508992dff..f23097881 100644 --- a/packages/sdks/vue-sdk/src/Descope.vue +++ b/packages/sdks/vue-sdk/src/Descope.vue @@ -15,6 +15,7 @@ :auto-focus="autoFocus" :style-id="styleId" :validate-on-blur="validateOnBlur" + :restart-on-error="restartOnError" :store-last-authenticated-user="storeLastAuthenticatedUser" :errorTransformer.prop="errorTransformer" :form.attr="formStr" @@ -85,6 +86,9 @@ const props = defineProps({ validateOnBlur: { type: Boolean, }, + restartOnError: { + type: Boolean, + }, errorTransformer: { type: Function, }, diff --git a/packages/sdks/web-component/README.md b/packages/sdks/web-component/README.md index 621fce31c..f93bd35b2 100644 --- a/packages/sdks/web-component/README.md +++ b/packages/sdks/web-component/README.md @@ -78,6 +78,11 @@ NOTE: This package is a part of a monorepo. so if you make changes in a dependen | debug | **"true"** - Enable debugger
**"false"** - Disable debugger | **"false"** | | preview | **"true"** - Run flow in a preview mode
**"false"** - Do run flow in a preview mode | **"false"** | | auto-focus | **"true"** - Automatically focus on the first input of each screen
**"false"** - Do not automatically focus on screen's inputs
**"skipFirstScreen"** - Automatically focus on the first input of each screen, except first screen | **"true"** | + +| validate-on-blur | **"true"** - Triggers the input validation upon blur in addition to the validation on submit
**"false"** - Do not triggers validation upon blur
| **"false"** | + +| restart-on-error | **"true"** - In case of flow version mismatch, will restart the flow if the components version was not changed
**"false"** - Do not restart the flow automatically
| **"false"** | + | storage-prefix | **String** - A prefix to add to the key of the local storage when persisting tokens | **""** | | store-last-authenticated-user | **"true"** - Stores last-authenticated user details in local storage when flow is completed
**"false"** - Do not store last-auth user details. Disabling this flag may cause last-authenticated user features to not function properly | **"true"** | | keep-last-authenticated-user-after-logout | **"true"** - Do not clear the last authenticated user details from the browser storage after logout
**"false"** - Clear the last authenticated user details from the browser storage after logout | **"false"** |