@adminforth/two-factors-auth 6.0.0 → 7.0.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.
- package/build.log +2 -2
- package/custom/LoginWithPasskeyButton.vue +3 -2
- package/custom/TwoFAModal.vue +2 -0
- package/custom/TwoFaCard.vue +28 -36
- package/dist/custom/LoginWithPasskeyButton.vue +3 -2
- package/dist/custom/TwoFAModal.vue +2 -0
- package/dist/custom/TwoFaCard.vue +28 -36
- package/package.json +2 -2
package/build.log
CHANGED
|
@@ -21,5 +21,5 @@ custom/tsconfig.json
|
|
|
21
21
|
custom/use2faApi.ts
|
|
22
22
|
custom/utils.js
|
|
23
23
|
|
|
24
|
-
sent
|
|
25
|
-
total size is
|
|
24
|
+
sent 299,994 bytes received 324 bytes 600,636.00 bytes/sec
|
|
25
|
+
total size is 298,743 speedup is 0.99
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
|
|
3
|
+
<!-- right after the OAuth buttons it joins them with their 8px gap instead of the 16px between login page injections -->
|
|
3
4
|
<Button
|
|
4
5
|
variant="secondary"
|
|
5
|
-
class="af-login-with-passkey-btn w-full gap-2"
|
|
6
|
+
class="af-login-with-passkey-btn w-full gap-2 [.af-oauth-login+&]:!mt-2"
|
|
6
7
|
@click="handleLoginWithPasskey"
|
|
7
8
|
>
|
|
8
|
-
<IconFingerprint class="w-
|
|
9
|
+
<IconFingerprint class="w-4 h-4 text-lightPrimary dark:text-darkPrimary" />
|
|
9
10
|
{{ $t('Continue with Passkey') }}
|
|
10
11
|
</Button>
|
|
11
12
|
|
package/custom/TwoFAModal.vue
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="af-two-factors-modal fixed inset-0 z-[9999] flex items-center justify-center bg-lightScrim dark:bg-darkScrim top-0 bottom-0 left-0 right-0 px-4"
|
|
3
3
|
v-if="modelShow && (isLoading === false)">
|
|
4
|
+
<!-- the card floats over the page here, so it takes the shadow of floating layers -->
|
|
4
5
|
<TwoFaCard
|
|
6
|
+
class="shadow-popover dark:shadow-darkPopover"
|
|
5
7
|
:class="`af-two-factor-modal-${modalMode}`"
|
|
6
8
|
:title="dialogTitle"
|
|
7
9
|
:subtitle="subtitles[modalMode]"
|
package/custom/TwoFaCard.vue
CHANGED
|
@@ -1,44 +1,36 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
</
|
|
24
|
-
|
|
25
|
-
<
|
|
26
|
-
<slot />
|
|
27
|
-
<p v-if="error" role="alert" class="af-2fa-code-error -mt-2.5 flex items-center gap-1.5 text-sm text-lightDanger dark:text-darkDanger">
|
|
28
|
-
<IconCircleAlert class="w-4 h-4 shrink-0" />
|
|
29
|
-
{{ error }}
|
|
30
|
-
</p>
|
|
31
|
-
</div>
|
|
32
|
-
|
|
33
|
-
<div v-if="$slots.footer" class="af-2fa-footer flex flex-wrap items-center gap-x-3 gap-y-2 border-t border-lightDialogBreakLine bg-lightFormHeading py-3 pl-6 pr-5 dark:border-darkDialogBreakLine dark:bg-darkFormHeading">
|
|
2
|
+
<DialogPanel
|
|
3
|
+
class="af-2fa-card"
|
|
4
|
+
:title="title"
|
|
5
|
+
:subtitle="subtitle"
|
|
6
|
+
:error="error"
|
|
7
|
+
:closable="closable"
|
|
8
|
+
:classes="{
|
|
9
|
+
header: 'af-2fa-header',
|
|
10
|
+
icon: 'af-2fa-icon-wrap',
|
|
11
|
+
titleWrap: 'af-2fa-title-wrap',
|
|
12
|
+
title: 'af-2fa-title',
|
|
13
|
+
subtitle: 'af-2fa-subtitle',
|
|
14
|
+
close: 'af-2fa-close-btn',
|
|
15
|
+
body: 'af-2fa-body',
|
|
16
|
+
error: 'af-2fa-code-error',
|
|
17
|
+
footer: 'af-2fa-footer',
|
|
18
|
+
}"
|
|
19
|
+
@close="emit('close')"
|
|
20
|
+
>
|
|
21
|
+
<template #icon>
|
|
22
|
+
<IconShieldCheck class="af-2fa-shield-icon" />
|
|
23
|
+
</template>
|
|
24
|
+
<slot />
|
|
25
|
+
<template v-if="$slots.footer" #footer>
|
|
34
26
|
<slot name="footer" />
|
|
35
|
-
</
|
|
36
|
-
</
|
|
27
|
+
</template>
|
|
28
|
+
</DialogPanel>
|
|
37
29
|
</template>
|
|
38
30
|
|
|
39
31
|
<script setup lang="ts">
|
|
40
|
-
import {
|
|
41
|
-
import {
|
|
32
|
+
import { IconShieldCheck } from '@iconify-prerendered/vue-lucide';
|
|
33
|
+
import { DialogPanel } from '@/afcl';
|
|
42
34
|
|
|
43
35
|
defineProps<{
|
|
44
36
|
title: string;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
|
|
3
|
+
<!-- right after the OAuth buttons it joins them with their 8px gap instead of the 16px between login page injections -->
|
|
3
4
|
<Button
|
|
4
5
|
variant="secondary"
|
|
5
|
-
class="af-login-with-passkey-btn w-full gap-2"
|
|
6
|
+
class="af-login-with-passkey-btn w-full gap-2 [.af-oauth-login+&]:!mt-2"
|
|
6
7
|
@click="handleLoginWithPasskey"
|
|
7
8
|
>
|
|
8
|
-
<IconFingerprint class="w-
|
|
9
|
+
<IconFingerprint class="w-4 h-4 text-lightPrimary dark:text-darkPrimary" />
|
|
9
10
|
{{ $t('Continue with Passkey') }}
|
|
10
11
|
</Button>
|
|
11
12
|
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="af-two-factors-modal fixed inset-0 z-[9999] flex items-center justify-center bg-lightScrim dark:bg-darkScrim top-0 bottom-0 left-0 right-0 px-4"
|
|
3
3
|
v-if="modelShow && (isLoading === false)">
|
|
4
|
+
<!-- the card floats over the page here, so it takes the shadow of floating layers -->
|
|
4
5
|
<TwoFaCard
|
|
6
|
+
class="shadow-popover dark:shadow-darkPopover"
|
|
5
7
|
:class="`af-two-factor-modal-${modalMode}`"
|
|
6
8
|
:title="dialogTitle"
|
|
7
9
|
:subtitle="subtitles[modalMode]"
|
|
@@ -1,44 +1,36 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
</
|
|
24
|
-
|
|
25
|
-
<
|
|
26
|
-
<slot />
|
|
27
|
-
<p v-if="error" role="alert" class="af-2fa-code-error -mt-2.5 flex items-center gap-1.5 text-sm text-lightDanger dark:text-darkDanger">
|
|
28
|
-
<IconCircleAlert class="w-4 h-4 shrink-0" />
|
|
29
|
-
{{ error }}
|
|
30
|
-
</p>
|
|
31
|
-
</div>
|
|
32
|
-
|
|
33
|
-
<div v-if="$slots.footer" class="af-2fa-footer flex flex-wrap items-center gap-x-3 gap-y-2 border-t border-lightDialogBreakLine bg-lightFormHeading py-3 pl-6 pr-5 dark:border-darkDialogBreakLine dark:bg-darkFormHeading">
|
|
2
|
+
<DialogPanel
|
|
3
|
+
class="af-2fa-card"
|
|
4
|
+
:title="title"
|
|
5
|
+
:subtitle="subtitle"
|
|
6
|
+
:error="error"
|
|
7
|
+
:closable="closable"
|
|
8
|
+
:classes="{
|
|
9
|
+
header: 'af-2fa-header',
|
|
10
|
+
icon: 'af-2fa-icon-wrap',
|
|
11
|
+
titleWrap: 'af-2fa-title-wrap',
|
|
12
|
+
title: 'af-2fa-title',
|
|
13
|
+
subtitle: 'af-2fa-subtitle',
|
|
14
|
+
close: 'af-2fa-close-btn',
|
|
15
|
+
body: 'af-2fa-body',
|
|
16
|
+
error: 'af-2fa-code-error',
|
|
17
|
+
footer: 'af-2fa-footer',
|
|
18
|
+
}"
|
|
19
|
+
@close="emit('close')"
|
|
20
|
+
>
|
|
21
|
+
<template #icon>
|
|
22
|
+
<IconShieldCheck class="af-2fa-shield-icon" />
|
|
23
|
+
</template>
|
|
24
|
+
<slot />
|
|
25
|
+
<template v-if="$slots.footer" #footer>
|
|
34
26
|
<slot name="footer" />
|
|
35
|
-
</
|
|
36
|
-
</
|
|
27
|
+
</template>
|
|
28
|
+
</DialogPanel>
|
|
37
29
|
</template>
|
|
38
30
|
|
|
39
31
|
<script setup lang="ts">
|
|
40
|
-
import {
|
|
41
|
-
import {
|
|
32
|
+
import { IconShieldCheck } from '@iconify-prerendered/vue-lucide';
|
|
33
|
+
import { DialogPanel } from '@/afcl';
|
|
42
34
|
|
|
43
35
|
defineProps<{
|
|
44
36
|
title: string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adminforth/two-factors-auth",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "7.0.0",
|
|
4
4
|
"description": "AdminForth plugin for two factors authentication",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"zod": "^4.3.6"
|
|
30
30
|
},
|
|
31
31
|
"peerDependencies": {
|
|
32
|
-
"adminforth": "^4.
|
|
32
|
+
"adminforth": "^4.6.0"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"@types/node": "^22.10.7",
|