@functionalcms/svelte-components 2.2.1 → 2.3.0

package/dist/components/layouts/DefaultLayout.svelte

@@ -0,0 +1,71 @@
+<script>import { page } from "$app/stores";
+import { title } from "../stores/title";
+import { meta } from "../stores/meta";
+export let follow = true;
+export let index = true;
+$:
+  robots = `${follow ? "follow" : "nofollow"}${index ? "index" : "noindex"}`;
+</script>
+
+<svelte:head>
+	<script
+		data-goatcounter="https://tracking.functional-cms.com/count"
+		async
+		src="//gc.zgo.at/count.js"></script>
+    
+    <title>{$title}</title>
+    <meta name="og:title" property="og:title" content="{$title}" />
+    <meta name="twitter:card" content="{$title}" />
+	
+	<meta name="robots" content={robots} />
+	<meta name="description" content={meta.description} />
+	<meta name="keywords" content={meta.keywords} />
+	<meta name=”viewport” content="width=device-width, initial-scale=1.0" /> 
+</svelte:head>
+
+<div>
+	{#if $$slots.header}
+		<header>
+			<slot name="header" />
+		</header>
+	{/if}
+	<main>
+		<slot />
+	</main>
+	{#if $$slots.footer}
+		<footer>
+			<slot name="footer" />
+		</footer>
+	{/if}
+	<div id="drawer-root"></div>
+</div>
+
+{#if $$slots.sticky_footer}
+	<footer>
+		<slot name="sticky_footer" />
+	</footer>
+{/if}
+<noscript>
+	<img src="https://tracking.functional-cms.com/count?p=/{$page.url.pathname}}" />
+</noscript>
+
+<style>
+	:global(html),
+	:global(body),
+	:global(body > div) {
+		height: 100%;
+	}
+	:global(body > div) {
+		display: flex;
+		flex-direction: column;
+	}
+	:global(body > footer) {
+		flex-shrink: 0;
+	}
+	div {
+		flex: 1 0 auto;
+	}
+	footer {
+		flex-shrink: 0;
+	}
+</style>

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

@@ -0,0 +1,22 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        follow?: boolean | undefined;
+        index?: boolean | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        header: {};
+        default: {};
+        footer: {};
+        sticky_footer: {};
+    };
+};
+export type DefaultLayoutProps = typeof __propDef.props;
+export type DefaultLayoutEvents = typeof __propDef.events;
+export type DefaultLayoutSlots = typeof __propDef.slots;
+export default class DefaultLayout extends SvelteComponent<DefaultLayoutProps, DefaultLayoutEvents, DefaultLayoutSlots> {
+}
+export {};

package/dist/index.d.ts

@@ -2,11 +2,11 @@ import FlatMenu from './components/menu/FlatMenu.svelte';
 import HamburgerMenu from './components/menu/HamburgerMenu.svelte';
 import { Visiblity, HeaderNavigationItem } from './components/menu/Menu.js';
 import Banner from './components/Banner.svelte';
-import Layout from './components/Layout.svelte';
+import DefaultLayout from './components/layouts/DefaultLayout.svelte';
 import Logo from './components/Logo.svelte';
 import SimpleFooter from './components/SimpleFooter.svelte';
 import Spacer from './components/Spacer.svelte';
 import Well from './components/Well.svelte';
 import { Justify, Placement, Orientation, Position, Sizes } from './components/Styling.js';
 import { Alert, Avatar, AvatarGroup, Breadcrumb, Button, ButtonGroup, Card, ChoiceInput, Close, Dialog, Disclose, Divider, Drawer, EmptyState, Header, HeaderNav, HeaderNavItem, Icon, IconSvg, Input, InputAddonItem, Loader, Menu, MenuItem, Pagination, Progress, Select, Spinner, Switch, Table, Tabs, Tag, Toast, Toasts } from 'agnostic-svelte';
-export { FlatMenu, HamburgerMenu, Visiblity, HeaderNavigationItem, Banner, Layout, Logo, SimpleFooter, Spacer, Well, Justify, Placement, Orientation, Position, Sizes, Alert, Avatar, AvatarGroup, Breadcrumb, Button, ButtonGroup, Card, ChoiceInput, Close, Dialog, Disclose, Divider, Drawer, EmptyState, Header, HeaderNav, HeaderNavItem, Icon, IconSvg, Input, InputAddonItem, Loader, Menu, MenuItem, Pagination, Progress, Select, Spinner, Switch, Table, Tabs, Tag, Toast, Toasts };
+export { FlatMenu, HamburgerMenu, Visiblity, HeaderNavigationItem, Banner, DefaultLayout, Logo, SimpleFooter, Spacer, Well, Justify, Placement, Orientation, Position, Sizes, Alert, Avatar, AvatarGroup, Breadcrumb, Button, ButtonGroup, Card, ChoiceInput, Close, Dialog, Disclose, Divider, Drawer, EmptyState, Header, HeaderNav, HeaderNavItem, Icon, IconSvg, Input, InputAddonItem, Loader, Menu, MenuItem, Pagination, Progress, Select, Spinner, Switch, Table, Tabs, Tag, Toast, Toasts };

package/dist/index.js

@@ -3,11 +3,11 @@ import FlatMenu from './components/menu/FlatMenu.svelte';
 import HamburgerMenu from './components/menu/HamburgerMenu.svelte';
 import { Visiblity, HeaderNavigationItem } from './components/menu/Menu.js';
 import Banner from './components/Banner.svelte';
-import Layout from './components/Layout.svelte';
+import DefaultLayout from './components/layouts/DefaultLayout.svelte';
 import Logo from './components/Logo.svelte';
 import SimpleFooter from './components/SimpleFooter.svelte';
 import Spacer from './components/Spacer.svelte';
 import Well from './components/Well.svelte';
 import { Justify, Placement, Orientation, Position, Sizes } from './components/Styling.js';
 import { Alert, Avatar, AvatarGroup, Breadcrumb, Button, ButtonGroup, Card, ChoiceInput, Close, Dialog, Disclose, Divider, Drawer, EmptyState, Header, HeaderNav, HeaderNavItem, Icon, IconSvg, Input, InputAddonItem, Loader, Menu, MenuItem, Pagination, Progress, Select, Spinner, Switch, Table, Tabs, Tag, Toast, Toasts } from 'agnostic-svelte';
-export { FlatMenu, HamburgerMenu, Visiblity, HeaderNavigationItem, Banner, Layout, Logo, SimpleFooter, Spacer, Well, Justify, Placement, Orientation, Position, Sizes, Alert, Avatar, AvatarGroup, Breadcrumb, Button, ButtonGroup, Card, ChoiceInput, Close, Dialog, Disclose, Divider, Drawer, EmptyState, Header, HeaderNav, HeaderNavItem, Icon, IconSvg, Input, InputAddonItem, Loader, Menu, MenuItem, Pagination, Progress, Select, Spinner, Switch, Table, Tabs, Tag, Toast, Toasts };
+export { FlatMenu, HamburgerMenu, Visiblity, HeaderNavigationItem, Banner, DefaultLayout, Logo, SimpleFooter, Spacer, Well, Justify, Placement, Orientation, Position, Sizes, Alert, Avatar, AvatarGroup, Breadcrumb, Button, ButtonGroup, Card, ChoiceInput, Close, Dialog, Disclose, Divider, Drawer, EmptyState, Header, HeaderNav, HeaderNavItem, Icon, IconSvg, Input, InputAddonItem, Loader, Menu, MenuItem, Pagination, Progress, Select, Spinner, Switch, Table, Tabs, Tag, Toast, Toasts };

package/dist/stores/meta.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="svelte" />
+import { type Writable } from 'svelte/store';
+export declare const title: {
+    description: Writable<string>;
+    keywords: Writable<string>;
+    setDescription: (descriptionText: string) => void;
+    setKeywords: (keywordsText: string) => void;
+};

package/dist/stores/meta.js

@@ -0,0 +1,12 @@
+import { get, writable } from 'svelte/store';
+function createMeta() {
+    const description = writable("");
+    const keywords = writable("");
+    return {
+        description,
+        keywords,
+        setDescription: (descriptionText) => description.set(descriptionText),
+        setKeywords: (keywordsText) => description.set(keywordsText),
+    };
+}
+export const title = createMeta();

package/dist/stores/pages.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="svelte" />
+import { HeaderNavigationItem } from "@functionalcms/svelte-components";
+export declare const pages: {
+    subscribe: (this: void, run: import("svelte/store").Subscriber<HeaderNavigationItem[]>, invalidate?: import("svelte/store").Invalidator<HeaderNavigationItem[]> | undefined) => import("svelte/store").Unsubscriber;
+    initialise: (pages: Array<HeaderNavigationItem>) => void;
+};

package/dist/stores/pages.js

@@ -0,0 +1,10 @@
+import { writable } from 'svelte/store';
+import { HeaderNavigationItem } from "@functionalcms/svelte-components";
+function createPages() {
+    const { subscribe, set } = writable(new Array());
+    return {
+        subscribe,
+        initialise: (pages) => set(pages)
+    };
+}
+export const pages = createPages();

package/dist/stores/title.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="svelte" />
+export declare const title: {
+    subscribe: (this: void, run: import("svelte/store").Subscriber<string>, invalidate?: import("svelte/store").Invalidator<string> | undefined) => import("svelte/store").Unsubscriber;
+    setTitleSuffix: (suffix: string) => void;
+    setTitle: (title: string) => void;
+};

package/dist/stores/title.js

@@ -0,0 +1,11 @@
+import { get, writable } from 'svelte/store';
+function createTitle() {
+    const { subscribe, set } = writable("");
+    const titleSuffix = writable("");
+    return {
+        subscribe,
+        setTitleSuffix: (suffix) => titleSuffix.set(suffix),
+        setTitle: (title) => set(`${title}${get(titleSuffix)}`)
+    };
+}
+export const title = createTitle();

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@functionalcms/svelte-components",
-	"version": "2.2.1",
+	"version": "2.3.0",
 	"scripts": {
 		"dev": "vite dev",
 		"build-css": "sass ./src/lib/css/properties.scss ./css/functional.css",

package/dist/components/Layout.svelte

@@ -1,51 +0,0 @@
-<style>
-    :global(html), :global(body), :global(body > div) {
-        height: 100%;
-    }
-    :global(body > div) {
-        display: flex;
-        flex-direction: column;
-    }
-    :global(body > footer) {
-        flex-shrink: 0;
-    } 
-    div {
-        flex: 1 0 auto;
-    }
-    footer {
-        flex-shrink: 0;
-    }
-</style>
-
-<svelte:head>
-    <script data-goatcounter="https://tracking.functional-cms.com/count" async src="//gc.zgo.at/count.js"></script>
-</svelte:head>
-
-<script>import { page } from "$app/stores";
-</script>
-
-<div>
-    {#if $$slots.header}
-        <header>
-            <slot name="header" />
-        </header>
-    {/if}
-    <main>
-        <slot />
-    </main>
-    {#if $$slots.footer}
-        <footer>
-            <slot name="footer" />
-        </footer>
-    {/if}
-    <div id="drawer-root"></div>
-</div>
-    
-{#if $$slots.sticky_footer}
-<footer>
-    <slot name="sticky_footer" />
-</footer>
-{/if}    
-<noscript>
-    <img src="https://tracking.functional-cms.com/count?p=/{$page.url.pathname}}">
-</noscript>

package/dist/components/Layout.svelte.d.ts

@@ -1,19 +0,0 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: Record<string, never>;
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        header: {};
-        default: {};
-        footer: {};
-        sticky_footer: {};
-    };
-};
-export type LayoutProps = typeof __propDef.props;
-export type LayoutEvents = typeof __propDef.events;
-export type LayoutSlots = typeof __propDef.slots;
-export default class Layout extends SvelteComponent<LayoutProps, LayoutEvents, LayoutSlots> {
-}
-export {};