@functionalcms/svelte-components 3.2.0 → 3.2.3

package/dist/components/agnostic/Card/Card.svelte

@@ -2,6 +2,19 @@
 	import { mergedClasses } from '../../CssHelper';
 	import { Orientation } from '../../Styling';
 
+	interface Props {
+		isAnimated?: boolean;
+		isSkinned?: boolean;
+		isStacked?: boolean;
+		isShadow?: boolean;
+		isBorder?: boolean;
+		isRounded?: boolean;
+		isWrap? : boolean;
+		orientation?: Orientation;
+		type?: string;
+		css?: string;
+	}
+
 	const {
 		isAnimated = false,
 		isSkinned = true,
@@ -9,20 +22,11 @@
 		isShadow = false,
 		isBorder = false,
 		isRounded = false,
+		isWrap = false,
 		orientation = Orientation.Column,
 		type = '',
 		css = ''
-	}: {
-		isAnimated?: boolean,
-		isSkinned?: boolean,
-		isStacked?: boolean,
-		isShadow?: boolean,
-		isBorder?: boolean,
-		isRounded?: boolean,
-		orientation?: Orientation,
-		type?: string,
-		css?: string,
-	} = $props();
+	}: Props  = $props();
 
 	let klasses = mergedClasses(
 		isSkinned ? 'card' : 'card-base',
@@ -33,6 +37,7 @@
 		isBorder ? 'card-border' : '',
 		type ? `card-${type}` : '',
 		`${orientation}`,
+		isWrap ? `card-wrap` : '', 
 		css ? `${css}` : ''
 	);
 </script>

package/dist/components/menu/NavigationItems.svelte

@@ -1,8 +1,7 @@
 <script lang="ts">
 	import { type HeaderNavigationItem, isSelected, defaultCss } from './Menu.js';
 	import { Orientation } from '../Styling.js';
-	import Link from '../Link.svelte';
-	import { page } from '$app/stores';
+	import { page } from '$app/state';
 	import { mergedClasses } from '../CssHelper.js';
 
 	export let css: { container: string[]; link: string[] } = defaultCss;
@@ -21,7 +20,7 @@
 <ul class={containerCss} role="menu" aria-label="menu">
 	{#each localPages as pageItem}
 		<li
-			aria-current={isSelected(includeSubpagesForSelect, $page, pageItem)}
+			aria-current={isSelected(includeSubpagesForSelect, page, pageItem)}
 			class={linkCss}
 			role="none"
 		>

package/dist/components/presentation/Gallery.svelte

@@ -3,28 +3,30 @@
 	import type { ShowItem } from './ShowItem.js';
 	import { AlignItmes, Justify, Orientation } from '../Styling.js';
 	import { mergedClasses } from '../CssHelper';
-	let {
-		items = [],
-		renderItem,
-		css = '',
-		justify = Justify.Between,
-		alignItems = AlignItmes.Center,
-		orientation = Orientation.DynamicRow
-	}: {
+	 
+	interface GaleryProps {
 		items: Array<ShowItem>;
 		renderItem: any;
 		css: string;
 		justify: Justify;
 		alignItems: AlignItmes;
 		orientation: Orientation;
-	} = $props();
-	// export let items: Array<ShowItem> = [];
-	// export let css: string = '';
-	// export let justify: Justify = Justify.Between;
-	// export let alignItems: AlignItmes = AlignItmes.Center;
-	// export let orientation: Orientation = Orientation.DynamicRow;
+		otherProps: any;
+	}
+
+	let {
+		items = [],
+		renderItem,
+		css = '',
+		justify = Justify.Between,
+		alignItems = AlignItmes.Center,
+		orientation = Orientation.DynamicRow,
+		...otherProps
+	}: GaleryProps = $props();
 
 	let galleryKlasses = mergedClasses('flex', css, `${orientation}`, `${justify}`, `${alignItems}`);
+
+	console.log(otherProps);
 </script>
 
 <Card css={galleryKlasses}>

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@functionalcms/svelte-components",
-	"version": "3.2.0",
+	"version": "3.2.3",
 	"watch": {
 		"build": {
 			"patterns": [
@@ -52,7 +52,8 @@
 		"svelte-check": "^4.0.0",
 		"tslib": "^2.6.2",
 		"typescript": "^5.0.0",
-		"vite": "^5.4.11"
+		"vite": "^5.4.11",
+		"watch": "^1.0.2"
 	},
 	"dependencies": {
 		"@floating-ui/dom": "^1.6.12",
@@ -60,13 +61,13 @@
 		"date-picker-svelte": "^2.14.1",
 		"focusable-selectors": "^0.8.4",
 		"ioredis": "^5.4.1",
+		"marked": "^15.0.5",
 		"node-html-parser": "^6.1.12",
 		"oauth4webapi": "^2.17.0",
 		"rehype-autolink-headings": "^7.1.0",
 		"rehype-slug": "^6.0.0",
 		"remark-abbr": "^1.4.2",
 		"remark-github": "^12.0.0",
-		"marked": "^15.0.5",
 		"svelte-file-dropzone": "^2.0.9"
 	},
 	"svelte": "./dist/index.js",