@functionalcms/svelte-components 2.3.3 → 2.3.5

package/dist/components/Banner.svelte

@@ -1,9 +1,13 @@
 <script>export let background = "";
 export let css = "";
+export let justify = Justify.Start;
+export let alignItems = AlignItmes.Start;
 $:
   klasses = [
     "flex",
-    css ? css : ""
+    css ? css : "",
+    `${justify}`,
+    `${alignItems}`
   ].filter((c) => c).join(" ");
 </script>
 

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

@@ -1,8 +1,11 @@
 import { SvelteComponent } from "svelte";
+import type { AlignItmes, Justify } from "./Styling.js";
 declare const __propDef: {
     props: {
         background?: string | undefined;
         css?: string | undefined;
+        justify?: Justify | undefined;
+        alignItems?: AlignItmes | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/components/Logo.svelte

@@ -15,8 +15,9 @@
 
 <script>export let companyName;
 export let logoUrl;
+export let css = "logo";
 </script>
 
-<a href="/">
+<a href="/" class={css}>
 	<img src={logoUrl} alt={companyName} />
 </a>

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

@@ -7,6 +7,9 @@ declare const __propDef: {
         /**
              * @type {string}
              */ logoUrl: string;
+        /**
+             * @type {string}
+             */ css?: string | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/components/Styling.d.ts

@@ -1,9 +1,16 @@
 export declare enum Justify {
-    Start = "start",
-    End = "end",
-    Center = "center",
-    Between = "between",
-    Around = "around"
+    Start = "justify-start",
+    End = "justify-end",
+    Center = "justify-center",
+    Between = "justify-between",
+    Around = "justify-around"
+}
+export declare enum AlignItmes {
+    Start = "items-start ",
+    End = "items-end",
+    Center = "items-center",
+    Baseline = "items-baseline",
+    Stretch = "items-stretch"
 }
 export declare enum Placement {
     Start = "start",

package/dist/components/Styling.js

@@ -1,11 +1,19 @@
 export var Justify;
 (function (Justify) {
-    Justify["Start"] = "start";
-    Justify["End"] = "end";
-    Justify["Center"] = "center";
-    Justify["Between"] = "between";
-    Justify["Around"] = "around";
+    Justify["Start"] = "justify-start";
+    Justify["End"] = "justify-end";
+    Justify["Center"] = "justify-center";
+    Justify["Between"] = "justify-between";
+    Justify["Around"] = "justify-around";
 })(Justify || (Justify = {}));
+export var AlignItmes;
+(function (AlignItmes) {
+    AlignItmes["Start"] = "items-start ";
+    AlignItmes["End"] = "items-end";
+    AlignItmes["Center"] = "items-center";
+    AlignItmes["Baseline"] = "items-baseline";
+    AlignItmes["Stretch"] = "items-stretch";
+})(AlignItmes || (AlignItmes = {}));
 export var Placement;
 (function (Placement) {
     Placement["Start"] = "start";

package/dist/components/Well.svelte

@@ -12,14 +12,18 @@
     }
 </style>
 
-<script>import { Orientation } from "./Styling.js";
+<script>import { AlignItmes, Justify, Orientation, Position } from "./Styling.js";
 export let css = "";
 export let orientation = Orientation.Column;
+export let justify = Justify.Start;
+export let alignItems = AlignItmes.Start;
 $:
   klasses = [
     "flex",
     css ? css : "",
-    `flex-${orientation}`
+    `flex-${orientation}`,
+    `${justify}`,
+    `${alignItems}`
   ].filter((c) => c).join(" ");
 </script>
 

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

@@ -1,9 +1,11 @@
 import { SvelteComponent } from "svelte";
-import { Orientation } from "./Styling.js";
+import { AlignItmes, Justify, Orientation } from "./Styling.js";
 declare const __propDef: {
     props: {
         css?: string | undefined;
         orientation?: Orientation | undefined;
+        justify?: Justify | undefined;
+        alignItems?: AlignItmes | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/index.d.ts

@@ -10,6 +10,6 @@ import Well from './components/Well.svelte';
 import { title, suffix } from './stores/title.js';
 import { pages } from './stores/pages.js';
 import { metaDescription, metaKeywords } from './stores/meta.js';
-import { Justify, Placement, Orientation, Position, Sizes } from './components/Styling.js';
+import { Justify, Placement, Orientation, Position, Sizes, AlignItmes } 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, DefaultLayout, Logo, SimpleFooter, Spacer, Well, Justify, Placement, Orientation, Position, Sizes, title, suffix, pages, metaDescription, metaKeywords, 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, AlignItmes, Position, Sizes, title, suffix, pages, metaDescription, metaKeywords, 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

@@ -11,6 +11,6 @@ import Well from './components/Well.svelte';
 import { title, suffix } from './stores/title.js';
 import { pages } from './stores/pages.js';
 import { metaDescription, metaKeywords } from './stores/meta.js';
-import { Justify, Placement, Orientation, Position, Sizes } from './components/Styling.js';
+import { Justify, Placement, Orientation, Position, Sizes, AlignItmes } 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, DefaultLayout, Logo, SimpleFooter, Spacer, Well, Justify, Placement, Orientation, Position, Sizes, title, suffix, pages, metaDescription, metaKeywords, 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, AlignItmes, Position, Sizes, title, suffix, pages, metaDescription, metaKeywords, 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/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@functionalcms/svelte-components",
-	"version": "2.3.3",
+	"version": "2.3.5",
 	"watch": {
 		"build": {
 			"patterns": ["src"],