@functionalcms/svelte-components 5.3.2 → 5.3.3
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/dist/components/form/SmartForm.svelte +1 -2
- package/dist/components/layouts/DefaultLayout.svelte +11 -10
- package/dist/server-side/auth/machine_authentication.js +0 -3
- package/dist/server-side/auth/user_authentication.js +13 -1
- package/dist/server-side/cookies.d.ts +1 -1
- package/dist/server-side/cookies.js +2 -2
- package/package.json +1 -1
|
@@ -58,7 +58,6 @@
|
|
|
58
58
|
|
|
59
59
|
const handleSubmit = async (event: Event) => {
|
|
60
60
|
event.preventDefault();
|
|
61
|
-
console.log('Submitting form to:', action);
|
|
62
61
|
loading = true;
|
|
63
62
|
try {
|
|
64
63
|
if (!isSendingMessage) {
|
|
@@ -180,6 +179,7 @@
|
|
|
180
179
|
{/snippet}
|
|
181
180
|
|
|
182
181
|
{#snippet renderPhoneInput(field: PhoneInputField)}
|
|
182
|
+
<Label class={field.labelClass}>{field.label}</Label>
|
|
183
183
|
<PhoneInput
|
|
184
184
|
id={field.id}
|
|
185
185
|
name={field.id}
|
|
@@ -187,7 +187,6 @@
|
|
|
187
187
|
readonly={field.readonly}
|
|
188
188
|
disabled={field.disabled}
|
|
189
189
|
class={field.class}
|
|
190
|
-
size={field.size}
|
|
191
190
|
placeholder={field.placeholder}
|
|
192
191
|
/>
|
|
193
192
|
{/snippet}
|
|
@@ -54,9 +54,10 @@
|
|
|
54
54
|
nonActiveClass: 'text-gray-700 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white',
|
|
55
55
|
footer:
|
|
56
56
|
'absolute start-0 bottom-0 z-20 w-full border-t border-gray-200 bg-white p-4 shadow-sm md:flex md:items-center md:justify-between md:p-6 dark:border-gray-600 dark:bg-gray-800',
|
|
57
|
-
footerLinks: ''
|
|
57
|
+
footerLinks: '',
|
|
58
|
+
main: 'min-h-screen'
|
|
58
59
|
};
|
|
59
|
-
const mergedClasses = $derived(
|
|
60
|
+
const mergedClasses = $derived({ ...defaultClasses, ...classes });
|
|
60
61
|
|
|
61
62
|
let activeUrl = $state(page.url.pathname);
|
|
62
63
|
|
|
@@ -74,40 +75,40 @@
|
|
|
74
75
|
</svelte:head>
|
|
75
76
|
|
|
76
77
|
<div class="w-full relative" id="defaultLayout">
|
|
77
|
-
<Navbar class={mergedClasses
|
|
78
|
+
<Navbar class={mergedClasses.navigation}>
|
|
78
79
|
<NavBrand href="/" class="logo">
|
|
79
|
-
<img src={logoUrl} class={mergedClasses
|
|
80
|
+
<img src={logoUrl} class={mergedClasses.logo} alt={companyName} />
|
|
80
81
|
{#if renderCompanyName}
|
|
81
|
-
<span class={mergedClasses
|
|
82
|
+
<span class={mergedClasses.companyName}>{companyName}</span>
|
|
82
83
|
{/if}
|
|
83
84
|
</NavBrand>
|
|
84
85
|
<NavHamburger />
|
|
85
86
|
<NavUl
|
|
86
87
|
{activeUrl}
|
|
87
|
-
classes={{ active: mergedClasses
|
|
88
|
+
classes={{ active: mergedClasses.activeClass, nonActive: mergedClasses.nonActiveClass }}
|
|
88
89
|
>
|
|
89
90
|
{#each menuItems as item}
|
|
90
91
|
{#if item?.items}
|
|
91
|
-
<NavLi class={mergedClasses
|
|
92
|
+
<NavLi class={mergedClasses.menuItem}>
|
|
92
93
|
<a href={item.href}>{item.label}</a>
|
|
93
94
|
<ChevronDownOutline class="text-primary-800 ms-2 inline h-6 w-6 dark:text-white" />
|
|
94
95
|
</NavLi>
|
|
95
96
|
<Dropdown simple class="w-44">
|
|
96
97
|
{#each item.items as subItem}
|
|
97
|
-
<DropdownItem class={mergedClasses
|
|
98
|
+
<DropdownItem class={mergedClasses.menuItem} href={subItem.href}
|
|
98
99
|
>{subItem.label}</DropdownItem
|
|
99
100
|
>
|
|
100
101
|
{/each}
|
|
101
102
|
</Dropdown>
|
|
102
103
|
{:else}
|
|
103
|
-
<NavLi class={mergedClasses
|
|
104
|
+
<NavLi class={mergedClasses.menuItem}>
|
|
104
105
|
<a href={item.href}>{item.label}</a>
|
|
105
106
|
</NavLi>
|
|
106
107
|
{/if}
|
|
107
108
|
{/each}
|
|
108
109
|
</NavUl>
|
|
109
110
|
</Navbar>
|
|
110
|
-
<main class=
|
|
111
|
+
<main class={mergedClasses.main}>
|
|
111
112
|
{@render children?.()}
|
|
112
113
|
</main>
|
|
113
114
|
{@render footerRender?.()}
|
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import { deleteCookie, loadCookie, saveCookie } from "../cookies";
|
|
2
1
|
import { userAuthenticationProvider } from "./userAuthenticationProvider";
|
|
3
2
|
import { encrypt } from "../crypto";
|
|
4
3
|
const accessTokenCookie = "functionalcms_access_token";
|
|
5
|
-
const idTokenCookie = "functionalcms_id_token";
|
|
6
4
|
const refreshTokenCookie = "functionalcms_refresh_token";
|
|
7
5
|
export const machineAuthenticationHandle = (secret, serverUrl, clientId, clientSecret) => {
|
|
8
6
|
const provider = userAuthenticationProvider(serverUrl, clientId);
|
|
@@ -39,7 +37,6 @@ const login = async (serverUrl, clientId, clientSecret) => {
|
|
|
39
37
|
const tokens = await tokenRes.json();
|
|
40
38
|
return {
|
|
41
39
|
access_token: tokens.access_token,
|
|
42
|
-
id_token: tokens.id_token,
|
|
43
40
|
refresh_token: tokens.refresh_token,
|
|
44
41
|
};
|
|
45
42
|
};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { deleteCookie, loadCookie, saveCookie } from "../cookies";
|
|
2
2
|
import { userAuthenticationProvider } from "./userAuthenticationProvider";
|
|
3
|
+
import { parse } from "svelte/compiler";
|
|
3
4
|
const pkceCookieName = "functionalcms_pkce";
|
|
4
5
|
const stateCookieName = "functionalcms_state";
|
|
5
6
|
const accessTokenCookie = "functionalcms_access_token";
|
|
@@ -34,6 +35,16 @@ function handleLogout(event) {
|
|
|
34
35
|
event.locals.user = null;
|
|
35
36
|
event.locals.session = {};
|
|
36
37
|
}
|
|
38
|
+
function parseJwt(token) {
|
|
39
|
+
const base64 = token.split('.')[1]
|
|
40
|
+
.replace(/-/g, '+')
|
|
41
|
+
.replace(/_/g, '/');
|
|
42
|
+
const json = decodeURIComponent(atob(base64)
|
|
43
|
+
.split('')
|
|
44
|
+
.map(c => '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2))
|
|
45
|
+
.join(''));
|
|
46
|
+
return JSON.parse(json);
|
|
47
|
+
}
|
|
37
48
|
async function handleLogin(event, provider, secret) {
|
|
38
49
|
const callbackUrl = new URL(`${event.url.origin}/auth/callback`);
|
|
39
50
|
const response = await provider.handleLogin(callbackUrl);
|
|
@@ -49,7 +60,8 @@ async function handleCallback(event, secret, provider) {
|
|
|
49
60
|
const response = await provider.handleCallback(expectedState, codeVerifier, event.url);
|
|
50
61
|
const headers = new Headers();
|
|
51
62
|
headers.set('Location', event.url.origin);
|
|
52
|
-
|
|
63
|
+
const accessToken = parseJwt(response.access_token);
|
|
64
|
+
await saveCookie(headers, secret, accessTokenCookie, response.access_token, accessToken.exp - Math.floor(Date.now() / 1000));
|
|
53
65
|
if (response.id_token) {
|
|
54
66
|
await saveCookie(headers, secret, idTokenCookie, response.id_token);
|
|
55
67
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export declare const saveCookie: (headers: Headers, secret: string, name: string, value: string) => Promise<void>;
|
|
1
|
+
export declare const saveCookie: (headers: Headers, secret: string, name: string, value: string, maxage?: number) => Promise<void>;
|
|
2
2
|
export declare const loadCookie: (cookies: any, secret: string, name: string) => Promise<string>;
|
|
3
3
|
export declare const deleteCookie: (cookies: any, headers: Headers, cookieName: string) => void;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { decrypt, encrypt } from "./crypto";
|
|
2
|
-
export const saveCookie = async (headers, secret, name, value) => {
|
|
2
|
+
export const saveCookie = async (headers, secret, name, value, maxage = 3600) => {
|
|
3
3
|
const encryptedValue = await encrypt(secret, value);
|
|
4
|
-
headers.append('Set-Cookie', `${name}=${encryptedValue}; HttpOnly; SameSite=None; Secure; Max-Age
|
|
4
|
+
headers.append('Set-Cookie', `${name}=${encryptedValue}; HttpOnly; SameSite=None; Secure; Max-Age=${maxage}; Path=/`);
|
|
5
5
|
};
|
|
6
6
|
export const loadCookie = async (cookies, secret, name) => {
|
|
7
7
|
const encryptedValue = cookies.get(name);
|