@functionalcms/svelte-components 5.0.2 → 5.1.0

package/dist/components/layouts/SimpleLayout.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import { afterNavigate } from '$app/navigation';
+
+	interface Props {
+		children: Snippet;
+		class: string
+	}
+
+	let { children, class: className }: Partial<Props> = $props();
+
+	afterNavigate(() => {
+		window.scrollTo({ top: 0, behavior: 'instant' });
+	});
+</script>
+
+<main class={`min-h-screen ${className}`}>
+	{@render children?.()}
+</main>

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

@@ -0,0 +1,7 @@
+import type { Snippet } from 'svelte';
+declare const SimpleLayout: import("svelte").Component<Partial<{
+    children: Snippet;
+    class: string;
+}>, {}, "">;
+type SimpleLayout = ReturnType<typeof SimpleLayout>;
+export default SimpleLayout;

package/dist/components/layouts copy/DefaultLayout.svelte

@@ -0,0 +1,115 @@
+<script lang="ts">
+	import { page } from '$app/state';
+	import type { Snippet } from 'svelte';
+	import {
+		Navbar,
+		NavBrand,
+		NavHamburger,
+		NavUl,
+		NavLi,
+		Dropdown,
+		DropdownItem,
+	} from 'flowbite-svelte';
+	import { type MenuOption } from './menuItems.js';
+	import { ChevronDownOutline } from 'flowbite-svelte-icons';
+	import { afterNavigate } from "$app/navigation";
+
+	interface Styles {
+		logo?: string;
+		companyName?: string;
+		navigation?: string;
+		menuItem?: string;
+		activeClass?: string;
+		nonActiveClass?: string;
+	}
+
+	interface Props {
+		children: Snippet;
+		canonicalUrl: string;
+		logoUrl?: string;
+		companyName?: string;
+		renderCompanyName?: boolean;
+		menuItems?: Array<MenuOption>;
+		footerRender?: Snippet;
+		classes?: Styles;
+	}
+
+	let {
+		children,
+		canonicalUrl,
+		logoUrl = undefined,
+		companyName = '',
+		renderCompanyName = true,
+		menuItems = [],
+		footerRender = undefined,
+		classes = {},
+	}: Partial<Props> = $props();
+
+	const defaultClasses = {
+		logo: 'me-3 h-6 sm:h-9',
+		companyName: 'self-center whitespace-nowrap text-xl font-semibold dark:text-white',
+		navigation: '',
+		menuItem: '',
+		activeClass: 'text-blue-700 dark:text-white',
+		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: ''
+	};
+	const mergedClasses = $derived(() => ({ ...defaultClasses, ...classes }));
+
+	let activeUrl = $state(page.url.pathname);
+
+	$effect(() => {
+		activeUrl = page.url.pathname;
+	});
+
+	afterNavigate(() => {
+		window.scrollTo({ top: 0, behavior: "instant" });
+	});
+</script>
+
+<svelte:head>
+	<link rel="canonical" href="{canonicalUrl}{page.url.pathname}" />
+</svelte:head>
+
+<div class="w-full relative" id="defaultLayout">
+	<Navbar class={mergedClasses().navigation}>
+		<NavBrand href="/" class="logo">
+			<img src={logoUrl} class={mergedClasses().logo} alt={companyName} />
+			{#if renderCompanyName}
+				<span class={mergedClasses().companyName}>{companyName}</span>
+			{/if}
+		</NavBrand>
+		<NavHamburger />
+		<NavUl
+			{activeUrl}
+			classes={{ active: mergedClasses().activeClass, nonActive: mergedClasses().nonActiveClass }}
+		>
+			{#each menuItems as item}
+				{#if item?.items}
+					<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}
+								>{subItem.label}</DropdownItem
+							>
+						{/each}
+					</Dropdown>
+				{:else}
+					<NavLi class={mergedClasses().menuItem}>
+						<a href={item.href}>{item.label}</a>
+					</NavLi>
+				{/if}
+			{/each}
+		</NavUl>
+	</Navbar>
+	<main class="min-h-screen">
+		{@render children?.()}
+	</main>
+	{@render footerRender?.()}
+
+</div>

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

@@ -0,0 +1,21 @@
+import type { Snippet } from 'svelte';
+import { type MenuOption } from './menuItems.js';
+declare const DefaultLayout: import("svelte").Component<Partial<{
+    children: Snippet;
+    canonicalUrl: string;
+    logoUrl?: string;
+    companyName?: string;
+    renderCompanyName?: boolean;
+    menuItems?: Array<MenuOption>;
+    footerRender?: Snippet;
+    classes?: {
+        logo?: string;
+        companyName?: string;
+        navigation?: string;
+        menuItem?: string;
+        activeClass?: string;
+        nonActiveClass?: string;
+    };
+}>, {}, "">;
+type DefaultLayout = ReturnType<typeof DefaultLayout>;
+export default DefaultLayout;

package/dist/components/layouts copy/MenuLayout.svelte

@@ -0,0 +1,63 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { MenuItem, MenuSection } from './menuItems.js';
+	import Icon from '../Icon.svelte';
+	import { afterNavigate } from '$app/navigation';
+	import {
+		Sidebar,
+		SidebarDropdownItem,
+		SidebarDropdownWrapper,
+		SidebarGroup,
+		SidebarItem,
+		SidebarButton,
+		uiHelpers
+	} from 'flowbite-svelte';
+
+	interface TwoColumnLayoutProps {
+		children: Snippet;
+		menuItems: Array<MenuSection | MenuItem>;
+	}
+
+	let { children, menuItems = [] }: Partial<TwoColumnLayoutProps> = $props();
+
+	let container: HTMLElement | undefined = undefined;
+	const helpers = uiHelpers();
+	afterNavigate(() => {
+		window.scrollTo({ top: 0, behavior: 'instant' });
+	});
+</script>
+
+<section class="flex flex-column md:flex-row" bind:this={container}>
+	<SidebarButton onclick={helpers.toggle} class="mb-2" />
+	<Sidebar
+		backdrop={false}
+		isOpen={helpers.isOpen}
+		closeSidebar={helpers.close}
+		position="fixed"
+		class="z-50 h-full"
+	>
+		<SidebarGroup>
+			{#each menuItems as item}
+				{#if 'items' in item}
+					<SidebarDropdownWrapper label={item.label}>
+						{#each item.items as subItem}
+							<SidebarDropdownItem label={subItem.label} href={subItem.href} />
+						{/each}
+					</SidebarDropdownWrapper>
+				{:else}
+					<SidebarItem label={item.label} href={item.href}>
+						{#snippet icon()}
+							<Icon icon={item.icon} />
+						{/snippet}
+					</SidebarItem>
+				{/if}
+			{/each}
+		</SidebarGroup>
+	</Sidebar>
+	<div class="content" style:flex="1">
+		{@render children?.()}
+	</div>
+</section>
+
+<style>
+</style>

package/dist/components/layouts copy/MenuLayout.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { MenuItem, MenuSection } from './menuItems.js';
+declare const MenuLayout: import("svelte").Component<Partial<{
+    children: Snippet;
+    menuItems: Array<MenuSection | MenuItem>;
+}>, {}, "">;
+type MenuLayout = ReturnType<typeof MenuLayout>;
+export default MenuLayout;

package/dist/components/layouts copy/menuItems.d.ts

@@ -0,0 +1,29 @@
+import type { Page } from "@sveltejs/kit";
+export declare enum Visibility {
+    Always = 0,
+    Authenticated = 1,
+    NotAuthenticated = 2
+}
+export type MenuItem = {
+    label: string;
+    href?: string;
+    icon?: string;
+    visibility?: Visibility;
+};
+export type MenuSection = {
+    label: string;
+    items: MenuItem[];
+    href?: string;
+    icon?: string;
+    visibility?: Visibility;
+};
+export type MenuDivider = {};
+export type MenuOption = MenuItem | MenuSection;
+export declare function selectVisible(pages: Array<MenuItem>, visibility: Visibility): MenuItem[];
+export declare function isSelected(includeSubpagesForSelect: boolean, page: any, item: MenuItem): any;
+export declare const defaultCss: {
+    buttonCss: never[];
+    container: never[];
+    link: never[];
+};
+export declare function isAuthenticated(page: Page): Visibility.Authenticated | Visibility.NotAuthenticated;

package/dist/components/layouts copy/menuItems.js

@@ -0,0 +1,28 @@
+export var Visibility;
+(function (Visibility) {
+    Visibility[Visibility["Always"] = 0] = "Always";
+    Visibility[Visibility["Authenticated"] = 1] = "Authenticated";
+    Visibility[Visibility["NotAuthenticated"] = 2] = "NotAuthenticated";
+})(Visibility || (Visibility = {}));
+export function selectVisible(pages, visibility) {
+    return pages.filter((page) => page?.visibility === Visibility.Always ||
+        page?.visibility === visibility);
+}
+export function isSelected(includeSubpagesForSelect, page, item) {
+    if (page?.url?.pathname === '/') {
+        return page?.url?.pathname === item.href;
+    }
+    return includeSubpagesForSelect
+        ? (page?.url.pathname.startsWith(item.href ?? '-') && item.href !== '/')
+        : page?.url.pathname === item.href;
+}
+export const defaultCss = {
+    buttonCss: [],
+    container: [],
+    link: []
+};
+export function isAuthenticated(page) {
+    const isAuthenticated = page?.data?.session != null;
+    const visibility = isAuthenticated ? Visibility.Authenticated : Visibility.NotAuthenticated;
+    return visibility;
+}

package/dist/index-server.d.ts

@@ -1,12 +1,12 @@
-export { authenticationHandle } from './auth/authenticationHandle.js';
-export { default as authorizationHandle } from './auth/authorizationHandle.js';
-export { default as errorHandler } from './auth/errorHandle.js';
-export { redisSessionProvider } from './auth/redisSessionProvider.js';
-export { machineAuthenticationProvider } from './auth/machineAuthenticationProvider.js';
-export { userAuthenticationProvider } from './auth/userAuthenticationProvider.js';
-export { getBlobService, getCommunicationService, getDataService, getTemplateService, getWebsiteService, getAIService, getAuthService, getFileService, } from './server-side/getServices.js';
-export type { RedirectResponse } from './auth/RedirectResponse.js';
-export { createMachineTokenApprovedLocals } from './auth/getMachineAccessToken.js';
+export { authenticationHandle } from './server-side/auth/authenticationHandle.js';
+export { default as authorizationHandle } from './server-side/auth/authorizationHandle.js';
+export { default as errorHandler } from './server-side/auth/errorHandle.js';
+export { redisSessionProvider } from './server-side/auth/redisSessionProvider.js';
+export { machineAuthenticationProvider } from './server-side/auth/machineAuthenticationProvider.js';
+export { userAuthenticationProvider } from './server-side/auth/userAuthenticationProvider.js';
+export { getCommunicationService, getDataService, getTemplateService, getWebsiteService, getAuthService, getFileService, } from './server-side/getServices.js';
+export type { RedirectResponse } from './server-side/auth/RedirectResponse.js';
+export { createMachineTokenApprovedLocals } from './server-side/auth/getMachineAccessToken.js';
 export { isHuman } from './components/form/AntiBot.js';
 export { paraglideHandler } from './server-side/handlers/paraglideHandler.js';
 export { redirectPipelineHandler } from './server-side/handlers/redirectPipelineHandler.js';

package/dist/index-server.js

@@ -1,11 +1,11 @@
-export { authenticationHandle } from './auth/authenticationHandle.js';
-export { default as authorizationHandle } from './auth/authorizationHandle.js';
-export { default as errorHandler } from './auth/errorHandle.js';
-export { redisSessionProvider } from './auth/redisSessionProvider.js';
-export { machineAuthenticationProvider } from './auth/machineAuthenticationProvider.js';
-export { userAuthenticationProvider } from './auth/userAuthenticationProvider.js';
-export { getBlobService, getCommunicationService, getDataService, getTemplateService, getWebsiteService, getAIService, getAuthService, getFileService, } from './server-side/getServices.js';
-export { createMachineTokenApprovedLocals } from './auth/getMachineAccessToken.js';
+export { authenticationHandle } from './server-side/auth/authenticationHandle.js';
+export { default as authorizationHandle } from './server-side/auth/authorizationHandle.js';
+export { default as errorHandler } from './server-side/auth/errorHandle.js';
+export { redisSessionProvider } from './server-side/auth/redisSessionProvider.js';
+export { machineAuthenticationProvider } from './server-side/auth/machineAuthenticationProvider.js';
+export { userAuthenticationProvider } from './server-side/auth/userAuthenticationProvider.js';
+export { getCommunicationService, getDataService, getTemplateService, getWebsiteService, getAuthService, getFileService, } from './server-side/getServices.js';
+export { createMachineTokenApprovedLocals } from './server-side/auth/getMachineAccessToken.js';
 export { isHuman } from './components/form/AntiBot.js';
 export { paraglideHandler } from './server-side/handlers/paraglideHandler.js';
 export { redirectPipelineHandler } from './server-side/handlers/redirectPipelineHandler.js';

package/dist/index.d.ts

@@ -1,13 +1,14 @@
 export { default as Meta } from './components/head/Meta.svelte';
 export { default as Font } from './components/head/Font.svelte';
-export { default as Tracker } from './components/layouts/Tracker.svelte';
+export { default as Tracker } from './components/head/Tracker.svelte';
 export { default as DefaultLayout } from './components/layouts/DefaultLayout.svelte';
 export { default as MenuLayout } from './components/layouts/MenuLayout.svelte';
-export { default as Well } from './components/layouts/Well.svelte';
-export { default as FlexBox } from './components/layouts/FlexBox.svelte';
-export { default as StyleBox } from './components/layouts/StyleBox.svelte';
+export { default as SimpleLayout } from './components/layouts/SimpleLayout.svelte';
 export type { MenuItem, MenuSection } from './components/layouts/menuItems.js';
 export { Visibility } from './components/layouts/menuItems.js';
+export { default as Well } from './components/presentation/Well.svelte';
+export { default as FlexBox } from './components/presentation/FlexBox.svelte';
+export { default as StyleBox } from './components/presentation/StyleBox.svelte';
 export { default as ImageCompare } from './components/presentation/ImageCompare.svelte';
 export { InputType, FieldType, type Field, type InputField, type TextareaField, type CollectionField, type SelectField, type FilePickerField, type TimePickerField, type PhoneInputField, SubmitResult, createInputField, createTextareaField, createFilePickerField, createCollectionField, createSelectField, createTimePickerField, createPhoneInputField, } from './components/form/form.js';
 export { default as AntiBot } from './components/form/AntiBot.svelte';

package/dist/index.js

@@ -1,16 +1,14 @@
 export { default as Meta } from './components/head/Meta.svelte';
 export { default as Font } from './components/head/Font.svelte';
-export { default as Tracker } from './components/layouts/Tracker.svelte';
+export { default as Tracker } from './components/head/Tracker.svelte';
 export { default as DefaultLayout } from './components/layouts/DefaultLayout.svelte';
 export { default as MenuLayout } from './components/layouts/MenuLayout.svelte';
-export { default as Well } from './components/layouts/Well.svelte';
-export { default as FlexBox } from './components/layouts/FlexBox.svelte';
-export { default as StyleBox } from './components/layouts/StyleBox.svelte';
+export { default as SimpleLayout } from './components/layouts/SimpleLayout.svelte';
 export { Visibility } from './components/layouts/menuItems.js';
+export { default as Well } from './components/presentation/Well.svelte';
+export { default as FlexBox } from './components/presentation/FlexBox.svelte';
+export { default as StyleBox } from './components/presentation/StyleBox.svelte';
 export { default as ImageCompare } from './components/presentation/ImageCompare.svelte';
-/*
- * Form
- */
 export { InputType, FieldType, SubmitResult, createInputField, createTextareaField, createFilePickerField, createCollectionField, createSelectField, createTimePickerField, createPhoneInputField, } from './components/form/form.js';
 export { default as AntiBot } from './components/form/AntiBot.svelte';
 export { default as SmartForm } from './components/form/SmartForm.svelte';

package/dist/{auth → server-side/auth}/redisSessionProvider.js

@@ -1,39 +1,33 @@
 import { getSid } from './sessionIdGenerator.js';
-import Redis from "ioredis";
-import { CACHE_SECRET } from '$env/static/private';
-const redis = new Redis.Redis(6380, "functional.redis.cache.windows.net", {
-    password: CACHE_SECRET,
-    tls: true
-});
-async function clean() {
-}
+const sessionStore = new Map();
 async function createSession(session, maxAge) {
     const sid = getSid();
     const sessionObject = {
         data: session,
         invalidAt: Date.now() + maxAge + 3600
     };
-    await redis.set(sid, JSON.stringify(sessionObject), "EX", maxAge);
+    sessionStore.set(sid, sessionObject);
     return sid;
 }
 async function updateSession(sid, session, maxAge) {
-    await redis.del(sid);
+    sessionStore.delete(sid);
     const sessionObject = {
         data: session,
         invalidAt: Date.now() + maxAge + 3600
     };
-    await redis.set(sid, JSON.stringify(sessionObject), "EX", maxAge);
+    sessionStore.set(sid, sessionObject);
 }
 async function getSession(sid) {
-    const savedSession = await redis.get(sid);
+    const savedSession = sessionStore.get(sid);
     if (savedSession) {
-        const session = JSON.parse(savedSession);
-        return session.data;
+        return savedSession.data;
     }
     return null;
 }
 async function deleteSession(sid) {
-    await redis.del(sid);
+    sessionStore.delete(sid);
+}
+async function clean() {
 }
 export const redisSessionProvider = {
     clean: clean,

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

@@ -1,10 +1,8 @@
-import { CommunicationService, DataService, TemplateService, WebsitesService, BlobService, AiService, AuthService, FilesService } from "@functionalcms/services";
+import { CommunicationService, DataService, TemplateService, WebsitesService, AuthService, FilesService } from "@functionalcms/services";
 import type { Locals } from "./types.js";
-export declare const getDataService: (locals: Locals, domain: string, endpoint: string) => DataService;
-export declare const getCommunicationService: (locals: Locals, domain: string, endpoint: string) => CommunicationService;
-export declare const getWebsiteService: (locals: Locals, domain: string, endpoint: string) => WebsitesService;
-export declare const getTemplateService: (locals: Locals, domain: string, endpoint: string) => TemplateService;
-export declare const getBlobService: (locals: Locals, domain: string, endpoint: string) => BlobService;
-export declare const getAIService: (locals: Locals, domain: string, endpoint: string) => AiService;
+export declare const getDataService: (locals: Locals, endpoint: string) => DataService;
+export declare const getCommunicationService: (locals: Locals, endpoint: string) => CommunicationService;
+export declare const getWebsiteService: (locals: Locals, endpoint: string) => WebsitesService;
+export declare const getTemplateService: (locals: Locals, endpoint: string) => TemplateService;
 export declare const getAuthService: (locals: Locals, endpoint: string) => AuthService;
-export declare const getFileService: (locals: Locals, domain: string, endpoint: string) => FilesService;
+export declare const getFileService: (locals: Locals, endpoint: string) => FilesService;

package/dist/server-side/getServices.js

@@ -1,35 +1,25 @@
-import { CommunicationService, DataService, TemplateService, WebsitesService, BlobService, AiService, AuthService, FilesService, } from "@functionalcms/services";
+import { CommunicationService, DataService, TemplateService, WebsitesService, AuthService, FilesService, } from "@functionalcms/services";
 const getAccessToken = (locals) => {
     return locals.token.access_token;
 };
-export const getDataService = (locals, domain, endpoint) => {
+export const getDataService = (locals, endpoint) => {
     const accessToken = getAccessToken(locals);
-    const service = new DataService(accessToken, domain, endpoint);
+    const service = new DataService(accessToken, endpoint);
     return service;
 };
-export const getCommunicationService = (locals, domain, endpoint) => {
+export const getCommunicationService = (locals, endpoint) => {
     const accessToken = getAccessToken(locals);
-    const service = new CommunicationService(accessToken, domain, endpoint);
+    const service = new CommunicationService(accessToken, endpoint);
     return service;
 };
-export const getWebsiteService = (locals, domain, endpoint) => {
+export const getWebsiteService = (locals, endpoint) => {
     const accessToken = getAccessToken(locals);
-    const service = new WebsitesService(accessToken, domain, endpoint);
+    const service = new WebsitesService(accessToken, endpoint);
     return service;
 };
-export const getTemplateService = (locals, domain, endpoint) => {
+export const getTemplateService = (locals, endpoint) => {
     const accessToken = getAccessToken(locals);
-    const service = new TemplateService(accessToken, domain, endpoint);
-    return service;
-};
-export const getBlobService = (locals, domain, endpoint) => {
-    const accessToken = getAccessToken(locals);
-    const service = new BlobService(accessToken, domain, endpoint);
-    return service;
-};
-export const getAIService = (locals, domain, endpoint) => {
-    const accessToken = getAccessToken(locals);
-    const service = new AiService(accessToken, domain, endpoint);
+    const service = new TemplateService(accessToken, endpoint);
     return service;
 };
 export const getAuthService = (locals, endpoint) => {
@@ -37,8 +27,8 @@ export const getAuthService = (locals, endpoint) => {
     const service = new AuthService(accessToken, endpoint);
     return service;
 };
-export const getFileService = (locals, domain, endpoint) => {
+export const getFileService = (locals, endpoint) => {
     const accessToken = getAccessToken(locals);
-    const service = new FilesService(accessToken, domain, endpoint);
+    const service = new FilesService(accessToken, endpoint);
     return service;
 };

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

@@ -1,4 +1,4 @@
-import type { Token } from "../auth/types.js";
+import type { Token } from "./auth/types.js";
 export interface Locals {
     token: Token;
     domain?: string;

package/package.json

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

package/dist/{auth → server-side/auth}/redisSessionProvider.d.ts

@@ -1,9 +1,9 @@
 import type { ISession, Sid } from './types.js';
-declare function clean(): Promise<void>;
 declare function createSession(session: ISession, maxAge: number): Promise<string>;
 declare function updateSession(sid: string, session: ISession, maxAge: number): Promise<void>;
 declare function getSession(sid: Sid): Promise<any>;
 declare function deleteSession(sid: string): Promise<void>;
+declare function clean(): Promise<void>;
 export declare const redisSessionProvider: {
     clean: typeof clean;
     createSession: typeof createSession;