@functionalcms/svelte-components 5.3.2 → 5.3.4

package/dist/components/form/SmartForm.svelte

@@ -58,7 +58,6 @@
 
 	const handleSubmit = async (event: Event) => {
 		event.preventDefault();
-		console.log('Submitting form to:', action);
 		loading = true;
 		try {
 			if (!isSendingMessage) {
@@ -180,6 +179,7 @@
 {/snippet}
 
 {#snippet renderPhoneInput(field: PhoneInputField)}
+	<Label class={field.labelClass}>{field.label}</Label>
 	<PhoneInput
 		id={field.id}
 		name={field.id}
@@ -187,7 +187,6 @@
 		readonly={field.readonly}
 		disabled={field.disabled}
 		class={field.class}
-		size={field.size}
 		placeholder={field.placeholder}
 	/>
 {/snippet}

package/dist/components/layouts/DefaultLayout.svelte

@@ -21,6 +21,7 @@
 		menuItem?: string;
 		activeClass?: string;
 		nonActiveClass?: string;
+		main?: string;
 	}
 
 	interface Props {
@@ -54,9 +55,10 @@
 		nonActiveClass: 'text-gray-700 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white',
 		footer:
 			'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',
-		footerLinks: ''
+		footerLinks: '',
+		main: 'min-h-screen',
 	};
-	const mergedClasses = $derived(() => ({ ...defaultClasses, ...classes }));
+	const mergedClasses = $derived({ ...defaultClasses, ...classes });
 
 	let activeUrl = $state(page.url.pathname);
 
@@ -74,40 +76,40 @@
 </svelte:head>
 
 <div class="w-full relative" id="defaultLayout">
-	<Navbar class={mergedClasses().navigation}>
+	<Navbar class={mergedClasses.navigation}>
 		<NavBrand href="/" class="logo">
-			<img src={logoUrl} class={mergedClasses().logo} alt={companyName} />
+			<img src={logoUrl} class={mergedClasses.logo} alt={companyName} />
 			{#if renderCompanyName}
-				<span class={mergedClasses().companyName}>{companyName}</span>
+				<span class={mergedClasses.companyName}>{companyName}</span>
 			{/if}
 		</NavBrand>
 		<NavHamburger />
 		<NavUl
 			{activeUrl}
-			classes={{ active: mergedClasses().activeClass, nonActive: mergedClasses().nonActiveClass }}
+			classes={{ active: mergedClasses.activeClass, nonActive: mergedClasses.nonActiveClass }}
 		>
 			{#each menuItems as item}
 				{#if item?.items}
-					<NavLi class={mergedClasses().menuItem}>
+					<NavLi class={mergedClasses.menuItem}>
 						<a href={item.href}>{item.label}</a>
 						<ChevronDownOutline class="text-primary-800 ms-2 inline h-6 w-6 dark:text-white" />
 					</NavLi>
 					<Dropdown simple class="w-44">
 						{#each item.items as subItem}
-							<DropdownItem class={mergedClasses().menuItem} href={subItem.href}
+							<DropdownItem class={mergedClasses.menuItem} href={subItem.href}
 								>{subItem.label}</DropdownItem
 							>
 						{/each}
 					</Dropdown>
 				{:else}
-					<NavLi class={mergedClasses().menuItem}>
+					<NavLi class={mergedClasses.menuItem}>
 						<a href={item.href}>{item.label}</a>
 					</NavLi>
 				{/if}
 			{/each}
 		</NavUl>
 	</Navbar>
-	<main class="min-h-screen">
+	<main class={mergedClasses.main}>
 		{@render children?.()}
 	</main>
 	{@render footerRender?.()}

package/dist/components/layouts/DefaultLayout.svelte.d.ts

@@ -15,6 +15,7 @@ declare const DefaultLayout: import("svelte").Component<Partial<{
         menuItem?: string;
         activeClass?: string;
         nonActiveClass?: string;
+        main?: string;
     };
 }>, {}, "">;
 type DefaultLayout = ReturnType<typeof DefaultLayout>;

package/dist/server-side/auth/machine_authentication.js

@@ -1,8 +1,6 @@
-import { deleteCookie, loadCookie, saveCookie } from "../cookies";
 import { userAuthenticationProvider } from "./userAuthenticationProvider";
 import { encrypt } from "../crypto";
 const accessTokenCookie = "functionalcms_access_token";
-const idTokenCookie = "functionalcms_id_token";
 const refreshTokenCookie = "functionalcms_refresh_token";
 export const machineAuthenticationHandle = (secret, serverUrl, clientId, clientSecret) => {
     const provider = userAuthenticationProvider(serverUrl, clientId);
@@ -39,7 +37,6 @@ const login = async (serverUrl, clientId, clientSecret) => {
     const tokens = await tokenRes.json();
     return {
         access_token: tokens.access_token,
-        id_token: tokens.id_token,
         refresh_token: tokens.refresh_token,
     };
 };

package/dist/server-side/auth/user_authentication.js

@@ -1,5 +1,6 @@
 import { deleteCookie, loadCookie, saveCookie } from "../cookies";
 import { userAuthenticationProvider } from "./userAuthenticationProvider";
+import { parse } from "svelte/compiler";
 const pkceCookieName = "functionalcms_pkce";
 const stateCookieName = "functionalcms_state";
 const accessTokenCookie = "functionalcms_access_token";
@@ -34,6 +35,16 @@ function handleLogout(event) {
     event.locals.user = null;
     event.locals.session = {};
 }
+function parseJwt(token) {
+    const base64 = token.split('.')[1]
+        .replace(/-/g, '+')
+        .replace(/_/g, '/');
+    const json = decodeURIComponent(atob(base64)
+        .split('')
+        .map(c => '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2))
+        .join(''));
+    return JSON.parse(json);
+}
 async function handleLogin(event, provider, secret) {
     const callbackUrl = new URL(`${event.url.origin}/auth/callback`);
     const response = await provider.handleLogin(callbackUrl);
@@ -49,7 +60,8 @@ async function handleCallback(event, secret, provider) {
     const response = await provider.handleCallback(expectedState, codeVerifier, event.url);
     const headers = new Headers();
     headers.set('Location', event.url.origin);
-    await saveCookie(headers, secret, accessTokenCookie, response.access_token);
+    const accessToken = parseJwt(response.access_token);
+    await saveCookie(headers, secret, accessTokenCookie, response.access_token, accessToken.exp - Math.floor(Date.now() / 1000));
     if (response.id_token) {
         await saveCookie(headers, secret, idTokenCookie, response.id_token);
     }

package/dist/server-side/cookies.d.ts

@@ -1,3 +1,3 @@
-export declare const saveCookie: (headers: Headers, secret: string, name: string, value: string) => Promise<void>;
+export declare const saveCookie: (headers: Headers, secret: string, name: string, value: string, maxage?: number) => Promise<void>;
 export declare const loadCookie: (cookies: any, secret: string, name: string) => Promise<string>;
 export declare const deleteCookie: (cookies: any, headers: Headers, cookieName: string) => void;

package/dist/server-side/cookies.js

@@ -1,7 +1,7 @@
 import { decrypt, encrypt } from "./crypto";
-export const saveCookie = async (headers, secret, name, value) => {
+export const saveCookie = async (headers, secret, name, value, maxage = 3600) => {
     const encryptedValue = await encrypt(secret, value);
-    headers.append('Set-Cookie', `${name}=${encryptedValue}; HttpOnly; SameSite=None; Secure; Max-Age=3600; Path=/`);
+    headers.append('Set-Cookie', `${name}=${encryptedValue}; HttpOnly; SameSite=None; Secure; Max-Age=${maxage}; Path=/`);
 };
 export const loadCookie = async (cookies, secret, name) => {
     const encryptedValue = cookies.get(name);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@functionalcms/svelte-components",
-	"version": "5.3.2",
+	"version": "5.3.4",
 	"license": "MIT",
 	"watch": {
 		"build": {