Skip to content

Commit 9c9e5df

Browse files
authored
Merge pull request #124 from ForgeRock/beta
Release Login Widget 1.1
2 parents 0d388a6 + f767a2b commit 9c9e5df

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+4106
-898
lines changed

package-lock.json

Lines changed: 0 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package/CHANGELOG.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,17 @@
1+
# [1.1.0-beta.2](https://github.com/forgerock/forgerock-web-login-framework/compare/v1.1.0-beta.1...v1.1.0-beta.2) (2023-06-22)
2+
3+
4+
### Features
5+
6+
* **callbacks:** add-webauthn-support ([26af184](https://github.com/forgerock/forgerock-web-login-framework/commit/26af18457b466f161288e64070a317ceba50f0b0))
7+
8+
# [1.1.0-beta.1](https://github.com/forgerock/forgerock-web-login-framework/compare/v1.0.2...v1.1.0-beta.1) (2023-06-12)
9+
10+
11+
### Features
12+
13+
* **callbacks:** device-profile-node addition ([a41fa12](https://github.com/forgerock/forgerock-web-login-framework/commit/a41fa129080ae957d803b4d40b254452d25055bb))
14+
115
## [1.0.2](https://github.com/forgerock/forgerock-web-login-framework/compare/v1.0.1...v1.0.2) (2023-04-18)
216

317

package/index.js

Lines changed: 3006 additions & 797 deletions
Large diffs are not rendered by default.

package/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,5 +13,5 @@
1313
},
1414
"license": "MIT",
1515
"dependencies": {},
16-
"version": "1.0.2"
16+
"version": "1.1.0-beta.2"
1717
}

package/widget.css

Lines changed: 40 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -412,6 +412,10 @@ grid-row-start: 2;
412412
margin-top: 1rem;
413413
margin-bottom: 1rem;
414414
}
415+
.tw_my-6 {
416+
margin-top: 1.5rem;
417+
margin-bottom: 1.5rem;
418+
}
415419
.tw_mb-6 {
416420
margin-bottom: 1.5rem;
417421
}
@@ -421,12 +425,15 @@ margin-top: -1.25rem;
421425
.tw_mb-2 {
422426
margin-bottom: 0.5rem;
423427
}
424-
.tw_ml-10 {
425-
margin-left: 2.5rem;
428+
.tw_mb-8 {
429+
margin-bottom: 2rem;
426430
}
427431
.tw_mb-4 {
428432
margin-bottom: 1rem;
429433
}
434+
.tw_ml-10 {
435+
margin-left: 2.5rem;
436+
}
430437
.tw_mr-2 {
431438
margin-right: 0.5rem;
432439
}
@@ -493,6 +500,9 @@ width: 6rem;
493500
.tw_flex-1 {
494501
flex: 1 1 0%;
495502
}
503+
.tw_border-collapse {
504+
border-collapse: collapse;
505+
}
496506
@keyframes tw_spin {
497507
to {
498508
transform: rotate(360deg);
@@ -501,9 +511,19 @@ transform: rotate(360deg);
501511
.tw_animate-spin {
502512
animation: tw_spin 1s linear infinite;
503513
}
514+
.tw_list-inside {
515+
list-style-position: inside;
516+
}
517+
.tw_list-decimal {
518+
list-style-type: decimal;
519+
}
504520
.tw_list-disc {
505521
list-style-type: disc;
506522
}
523+
.tw_columns-2 {
524+
-moz-columns: 2;
525+
columns: 2;
526+
}
507527
.tw_grid-cols-\[2\.5em_1fr\] {
508528
grid-template-columns: 2.5em 1fr;
509529
}
@@ -537,6 +557,9 @@ justify-items: stretch;
537557
.tw_gap-4 {
538558
gap: 1rem;
539559
}
560+
.tw_rounded-md {
561+
border-radius: 0.375rem;
562+
}
540563
.tw_rounded-full {
541564
border-radius: 9999px;
542565
}
@@ -596,6 +619,9 @@ text-align: center;
596619
.tw_text-right {
597620
text-align: right;
598621
}
622+
.tw_font-mono {
623+
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
624+
}
599625
.tw_text-base {
600626
font-size: 0.9375rem;
601627
line-height: 1.25;
@@ -604,6 +630,10 @@ line-height: 1.25;
604630
font-size: 0.875rem;
605631
line-height: 1.25;
606632
}
633+
.tw_text-lg {
634+
font-size: 1.25rem;
635+
line-height: 1;
636+
}
607637
.tw_text-4xl {
608638
font-size: 2.25rem;
609639
line-height: 2.5rem;
@@ -614,6 +644,9 @@ font-weight: 300;
614644
.tw_font-bold {
615645
font-weight: 700;
616646
}
647+
.tw_font-semibold {
648+
font-weight: 600;
649+
}
617650
.tw_text-primary-light {
618651
--tw-text-opacity: 1;
619652
color: rgb(2 122 184 / var(--tw-text-opacity));
@@ -630,6 +663,10 @@ color: rgb(55 65 81 / var(--tw-text-opacity));
630663
--tw-text-opacity: 1;
631664
color: rgb(37 99 235 / var(--tw-text-opacity));
632665
}
666+
.tw_text-secondary-light {
667+
--tw-text-opacity: 1;
668+
color: rgb(209 213 219 / var(--tw-text-opacity));
669+
}
633670
.tw_text-error-dark {
634671
--tw-text-opacity: 1;
635672
color: rgb(153 27 27 / var(--tw-text-opacity));
@@ -666,7 +703,7 @@ text-align: center;
666703
}
667704
.tw_secondary-header {
668705
font-weight: 500;
669-
font-size: 0.9375rem;
706+
font-size: 1.25rem;
670707
margin-bottom: 1rem;
671708
}
672709
}
Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<script lang="ts">
2+
export let classes = '';
3+
export let size = '24px';
4+
</script>
5+
6+
<svg
7+
class={classes}
8+
height={size}
9+
width={size}
10+
viewBox="0 0 16 16"
11+
xmlns="http://www.w3.org/2000/svg"
12+
>
13+
<path
14+
d="M8.06 6.5a.5.5 0 0 1 .5.5v.776a11.5 11.5 0 0 1-.552 3.519l-1.331 4.14a.5.5 0 0 1-.952-.305l1.33-4.141a10.5 10.5 0 0 0 .504-3.213V7a.5.5 0 0 1 .5-.5Z"
15+
/>
16+
<path
17+
d="M6.06 7a2 2 0 1 1 4 0 .5.5 0 1 1-1 0 1 1 0 1 0-2 0v.332c0 .409-.022.816-.066 1.221A.5.5 0 0 1 6 8.447c.04-.37.06-.742.06-1.115V7Zm3.509 1a.5.5 0 0 1 .487.513 11.5 11.5 0 0 1-.587 3.339l-1.266 3.8a.5.5 0 0 1-.949-.317l1.267-3.8a10.5 10.5 0 0 0 .535-3.048A.5.5 0 0 1 9.569 8Zm-3.356 2.115a.5.5 0 0 1 .33.626L5.24 14.939a.5.5 0 1 1-.955-.296l1.303-4.199a.5.5 0 0 1 .625-.329Z"
18+
/>
19+
<path
20+
d="M4.759 5.833A3.501 3.501 0 0 1 11.559 7a.5.5 0 0 1-1 0 2.5 2.5 0 0 0-4.857-.833.5.5 0 1 1-.943-.334Zm.3 1.67a.5.5 0 0 1 .449.546 10.72 10.72 0 0 1-.4 2.031l-1.222 4.072a.5.5 0 1 1-.958-.287L4.15 9.793a9.72 9.72 0 0 0 .363-1.842.5.5 0 0 1 .546-.449Zm6 .647a.5.5 0 0 1 .5.5c0 1.28-.213 2.552-.632 3.762l-1.09 3.145a.5.5 0 0 1-.944-.327l1.089-3.145c.382-1.105.578-2.266.578-3.435a.5.5 0 0 1 .5-.5Z"
21+
/>
22+
<path
23+
d="M3.902 4.222a4.996 4.996 0 0 1 5.202-2.113.5.5 0 0 1-.208.979 3.996 3.996 0 0 0-4.163 1.69.5.5 0 0 1-.831-.556Zm6.72-.955a.5.5 0 0 1 .705-.052A4.99 4.99 0 0 1 13.059 7v1.5a.5.5 0 1 1-1 0V7a3.99 3.99 0 0 0-1.386-3.028.5.5 0 0 1-.051-.705ZM3.68 5.842a.5.5 0 0 1 .422.568c-.029.192-.044.39-.044.59 0 .71-.1 1.417-.298 2.1l-1.14 3.923a.5.5 0 1 1-.96-.279L2.8 8.821A6.531 6.531 0 0 0 3.058 7c0-.25.019-.496.054-.736a.5.5 0 0 1 .568-.422Zm8.882 3.66a.5.5 0 0 1 .456.54c-.084 1-.298 1.986-.64 2.934l-.744 2.068a.5.5 0 0 1-.941-.338l.745-2.07a10.51 10.51 0 0 0 .584-2.678.5.5 0 0 1 .54-.456Z"
24+
/>
25+
<path
26+
d="M4.81 1.37A6.5 6.5 0 0 1 14.56 7a.5.5 0 1 1-1 0 5.5 5.5 0 0 0-8.25-4.765.5.5 0 0 1-.5-.865Zm-.89 1.257a.5.5 0 0 1 .04.706A5.478 5.478 0 0 0 2.56 7a.5.5 0 0 1-1 0c0-1.664.626-3.184 1.655-4.333a.5.5 0 0 1 .706-.04ZM1.915 8.02a.5.5 0 0 1 .346.616l-.779 2.767a.5.5 0 1 1-.962-.27l.778-2.767a.5.5 0 0 1 .617-.346Zm12.15.481a.5.5 0 0 1 .49.51c-.03 1.499-.161 3.025-.727 4.533l-.07.187a.5.5 0 0 1-.936-.351l.07-.187c.506-1.35.634-2.74.663-4.202a.5.5 0 0 1 .51-.49Z"
27+
/>
28+
</svg>
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<script lang="ts">
2+
export let classes = '';
3+
export let size = '24px';
4+
</script>
5+
6+
<svg
7+
xmlns="http://www.w3.org/2000/svg"
8+
height={size}
9+
width={size}
10+
class={classes}
11+
fill="currentColor"
12+
viewBox="0 0 16 18"
13+
>
14+
<path
15+
fill-rule="evenodd"
16+
d="M8 0c-.69 0-1.843.265-2.928.56-1.11.3-2.229.655-2.887.87a1.54 1.54 0 0 0-1.044 1.262c-.596 4.477.787 7.795 2.465 9.99a11.777 11.777 0 0 0 2.517 2.453c.386.273.744.482 1.048.625.28.132.581.24.829.24s.548-.108.829-.24a7.159 7.159 0 0 0 1.048-.625 11.775 11.775 0 0 0 2.517-2.453c1.678-2.195 3.061-5.513 2.465-9.99a1.541 1.541 0 0 0-1.044-1.263 62.467 62.467 0 0 0-2.887-.87C9.843.266 8.69 0 8 0zm2.146 5.146a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 7.793l2.646-2.647z"
17+
/>
18+
</svg>

src/lib/components/primitives/form/form.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
export let formEl: HTMLFormElement | null = null;
44
export let id = 'formId';
55
export let needsFocus = false;
6-
export let onSubmitWhenValid: (event: SubmitEvent, isFormValid: boolean) => void;
6+
export let onSubmitWhenValid: ((event: SubmitEvent, isFormValid: boolean) => void) | undefined = undefined;
77
88
let isFormValid = false;
99
@@ -80,7 +80,7 @@
8080
// If there's no invalid input, submit form.
8181
if (isFirstInvalidInput === null) {
8282
isFormValid = true;
83-
onSubmitWhenValid(event, isFormValid);
83+
onSubmitWhenValid && onSubmitWhenValid(event, isFormValid);
8484
}
8585
}
8686

src/lib/journey/_utilities/callback-mapper.svelte

Lines changed: 36 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@
55
*
66
* TODO: This could possibly be simplified if the `callback.getType` method in the SDK
77
* returned a union of the possible types, rather than just a generic `string` type.
8-
*/
8+
*/
99
10-
import { CallbackType } from '@forgerock/javascript-sdk';
10+
import { CallbackType, WebAuthnStepType } from '@forgerock/javascript-sdk';
1111
import type { z } from 'zod';
1212
1313
// Callback handler components
@@ -27,6 +27,8 @@
2727
import Unknown from '$journey/callbacks/unknown/unknown.svelte';
2828
import ValidatedCreatePassword from '$journey/callbacks/password/validated-create-password.svelte';
2929
import ValidatedCreateUsername from '$journey/callbacks/username/validated-create-username.svelte';
30+
import DeviceProfile from '$journey/callbacks/device-profile/device-profile.svelte';
31+
import Metadata from '$journey/callbacks/metadata/metadata.svelte';
3032
3133
import type {
3234
AttributeInputCallback,
@@ -45,6 +47,8 @@
4547
ValidatedCreatePasswordCallback,
4648
ValidatedCreateUsernameCallback,
4749
FRCallback,
50+
DeviceProfileCallback,
51+
MetadataCallback,
4852
} from '@forgerock/javascript-sdk';
4953
5054
import type {
@@ -55,13 +59,17 @@
5559
import type { styleSchema } from '$lib/style.store';
5660
import type { Maybe } from '$lib/interfaces';
5761
58-
export let props: {
62+
type Props = {
5963
callback: FRCallback;
6064
callbackMetadata: Maybe<CallbackMetadata>;
6165
selfSubmitFunction: SelfSubmitFunction;
6266
stepMetadata: Maybe<StepMetadata>;
6367
style: z.infer<typeof styleSchema>;
6468
};
69+
export let props:
70+
| Props
71+
| (Props & { recoveryCodes: Array<string> })
72+
| (Props & { webAuthnValue: WebAuthnStepType });
6573
6674
let cbType: string;
6775
@@ -81,16 +89,18 @@
8189
let _TermsAndConditionsCallback: TermsAndConditionsCallback;
8290
let _TextOutputCallback: TextOutputCallback;
8391
let _SuspendedTextOutputCallback: SuspendedTextOutputCallback;
92+
let _MetadataCallback: MetadataCallback;
93+
let _DeviceProfileCallback: DeviceProfileCallback;
8494
let _FRCallback: FRCallback;
8595
8696
$: {
8797
cbType = props.callback.getType();
8898
89-
switch(cbType) {
99+
switch (cbType) {
90100
case CallbackType.BooleanAttributeInputCallback:
91101
_BooleanAttributeInputCallback = props.callback as AttributeInputCallback<boolean>;
92-
break;
93-
case CallbackType.ChoiceCallback:
102+
break;
103+
case CallbackType.ChoiceCallback:
94104
_ChoiceCallback = props.callback as ChoiceCallback;
95105
break;
96106
case CallbackType.ConfirmationCallback:
@@ -119,8 +129,8 @@
119129
break;
120130
case CallbackType.StringAttributeInputCallback:
121131
_StringAttributeInputCallback = props.callback as AttributeInputCallback<string>;
122-
break;
123-
case CallbackType.ValidatedCreatePasswordCallback:
132+
break;
133+
case CallbackType.ValidatedCreatePasswordCallback:
124134
_ValidatedCreatePasswordCallback = props.callback as ValidatedCreatePasswordCallback;
125135
break;
126136
case CallbackType.ValidatedCreateUsernameCallback:
@@ -135,6 +145,12 @@
135145
case CallbackType.SuspendedTextOutputCallback:
136146
_SuspendedTextOutputCallback = props.callback as SuspendedTextOutputCallback;
137147
break;
148+
case CallbackType.DeviceProfileCallback:
149+
_DeviceProfileCallback = props.callback as DeviceProfileCallback;
150+
break;
151+
case CallbackType.MetadataCallback:
152+
_MetadataCallback = props.callback as MetadataCallback;
153+
break;
138154
default:
139155
_FRCallback = props.callback as FRCallback;
140156
}
@@ -237,6 +253,18 @@
237253
callback: _SuspendedTextOutputCallback,
238254
}}
239255
<TextOutput {...newProps} />
256+
{:else if cbType === CallbackType.DeviceProfileCallback}
257+
{@const newProps = {
258+
...props,
259+
callback: _DeviceProfileCallback,
260+
}}
261+
<DeviceProfile {...newProps} />
262+
{:else if cbType === CallbackType.MetadataCallback}
263+
{@const newProps = {
264+
...props,
265+
callback: _MetadataCallback,
266+
}}
267+
<Metadata {...newProps} />
240268
{:else}
241269
{@const newProps = {
242270
...props,

src/lib/journey/_utilities/map-stage.utilities.ts

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,24 @@ import Generic from '$journey/stages/generic.svelte';
22
import OneTimePassword from '$journey/stages/one-time-password.svelte';
33
import Registration from '$journey/stages/registration.svelte';
44
import Login from '$journey/stages/login.svelte';
5+
import WebAuthn from '$journey/stages/webauthn.svelte';
6+
import RecoveryCodes from '$journey/stages/recovery-codes.svelte';
57

68
import type { StepTypes } from '$journey/journey.interfaces';
9+
import { FRRecoveryCodes, FRWebAuthn } from '@forgerock/javascript-sdk';
710

811
/**
912
* @function mapStepToStage - Maps the current step to the proper stage component.
1013
* @param {object} currentStep - The current step to check
1114
* @returns {object} - The stage Svelte component
1215
*/
1316
export function mapStepToStage(currentStep: StepTypes) {
17+
// Handle unlikely error state
1418
if (!currentStep || currentStep.type !== 'Step') {
1519
return Generic;
1620
}
21+
22+
// Prioritize stage value if present
1723
switch (currentStep?.getStage && currentStep.getStage()) {
1824
case 'OneTimePassword':
1925
return OneTimePassword;
@@ -22,6 +28,18 @@ export function mapStepToStage(currentStep: StepTypes) {
2228
case 'DefaultLogin':
2329
return Login;
2430
default:
25-
return Generic;
31+
// Don't return function but continue on
32+
break;
33+
}
34+
35+
// getWebAuthnStepType will return 0 if not a WebAuthn step
36+
if (FRWebAuthn.getWebAuthnStepType(currentStep)) {
37+
return WebAuthn;
2638
}
39+
40+
if (FRRecoveryCodes.isDisplayStep(currentStep)) {
41+
return RecoveryCodes;
42+
}
43+
44+
return Generic;
2745
}

0 commit comments

Comments
 (0)