@bexis2/bexis2-core-ui 0.2.11 → 0.2.13

package/dist/components/page/Alert.svelte

@@ -7,33 +7,31 @@ export let cssClass = "";
 export let deleteBtn = true;
 $:
   show = true;
-</script>
-{#if show}
-
-<aside class="alert {cssClass}" transition:fade|local={{ duration: 100 }}>
- <!-- Icon -->
- <!-- <div>(icon)</div> -->
- <!-- Message -->
- <div class="alert-message">
-  
-    {#if title}
-      <h3 class="h3">{title}</h3>
-     {/if}
-     <p>{message}
-      <slot></slot>
-     </p>
- </div>
- <!-- Actions -->
- <div class="alert-actions">
-  <slot name="actions"/>
-
-  {#if deleteBtn}
-   <button class="btn hover:text-primary-100" on:click={()=>show = false}>
-    <Fa icon={faXmark} />
-   </button> 
-  {/if}
-
- </div>
-</aside>
-
-{/if}
+</script>
+
+{#if show}
+	<aside class="alert {cssClass}" transition:fade|local={{ duration: 100 }}>
+		<!-- Icon -->
+		<!-- <div>(icon)</div> -->
+		<!-- Message -->
+		<div class="alert-message">
+			{#if title}
+				<h3 class="h3">{title}</h3>
+			{/if}
+			<p>
+				{message}
+				<slot />
+			</p>
+		</div>
+		<!-- Actions -->
+		<div class="alert-actions">
+			<slot name="actions" />
+
+			{#if deleteBtn}
+				<button class="btn hover:text-primary-100" on:click={() => (show = false)}>
+					<Fa icon={faXmark} />
+				</button>
+			{/if}
+		</div>
+	</aside>
+{/if}

package/dist/components/page/BackToTop.svelte

@@ -1,30 +1,30 @@
-<script>
- export let showOnPx = 150;
- let hidden = true;
-
- function goTop() {
-   document.body.scrollIntoView();
- }
-
- function scrollContainer() {
-   return document.documentElement || document.body;
- }
-
- function handleOnScroll() {
-   if (!scrollContainer()) {
-     return;
-   }
-
-   if (scrollContainer().scrollTop > showOnPx) {
-     hidden = false;
-   } else {
-     hidden = true;
-   }
- }
-</script>
-
-<svelte:window on:scroll={handleOnScroll} />
-
-<div class="w-full items-center">
- <button class="btn ring back-to-top" on:click={goTop} class:hidden >Back to top</button>
-</div>
+<script>
+	export let showOnPx = 150;
+	let hidden = true;
+
+	function goTop() {
+		document.body.scrollIntoView();
+	}
+
+	function scrollContainer() {
+		return document.documentElement || document.body;
+	}
+
+	function handleOnScroll() {
+		if (!scrollContainer()) {
+			return;
+		}
+
+		if (scrollContainer().scrollTop > showOnPx) {
+			hidden = false;
+		} else {
+			hidden = true;
+		}
+	}
+</script>
+
+<svelte:window on:scroll={handleOnScroll} />
+
+<div class="w-full items-center">
+	<button class="btn ring back-to-top" on:click={goTop} class:hidden>Back to top</button>
+</div>

package/dist/components/page/Docs.svelte

@@ -12,22 +12,25 @@ const noteSettings = {
   target: "noteTarget",
   placement: "bottom"
 };
-</script>
-<div class="text-right p-2">
-{#if note}
-<span class="chip variant-soft hover:variant-filled" use:popup={noteSettings} >
- <span><Fa icon={faQuestion}/></span>
-</span>
-
-<div class="card p-4 variant-filled-primary w-60 z-50 text-left shadow-md" data-popup="noteTarget">
-	{note}
-</div>
-{/if}
-
-{#each links as link}
- <span class="chip variant-soft hover:variant-filled" on:click={()=>goTo(link.url,false)}>
-  <span>{link.label}</span>
- </span>
-{/each}
-</div>
-
+</script>
+
+<div class="text-right p-2">
+	{#if note}
+		<span class="chip variant-soft hover:variant-filled" use:popup={noteSettings}>
+			<span><Fa icon={faQuestion} /></span>
+		</span>
+
+		<div
+			class="card p-4 variant-filled-primary w-60 z-50 text-left shadow-md"
+			data-popup="noteTarget"
+		>
+			{note}
+		</div>
+	{/if}
+
+	{#each links as link}
+		<span class="chip variant-soft hover:variant-filled" on:click={() => goTo(link.url, false)}>
+			<span>{link.label}</span>
+		</span>
+	{/each}
+</div>

package/dist/components/page/Docs.svelte.d.ts

@@ -1,5 +1,5 @@
 import { SvelteComponentTyped } from "svelte";
-import type { linkType } from "../../models/Models";
+import type { linkType } from '../../models/Models';
 declare const __propDef: {
     props: {
         links?: linkType[] | undefined;

package/dist/components/page/ErrorMessage.svelte

@@ -1,9 +1,9 @@
 <script>export let error;
-</script>
-
-<div class="card bg-error-300 border-solid border-2 border-error-500 shadow-md max-w-md">
-<div class="p-5  space-y-4">
- <h3 class="h3">{error.name}</h3> 
- <p>{error.message}</p>
-</div>
-</div>
+</script>
+
+<div class="card bg-error-300 border-solid border-2 border-error-500 shadow-md max-w-md">
+	<div class="p-5 space-y-4">
+		<h3 class="h3">{error.name}</h3>
+		<p>{error.message}</p>
+	</div>
+</div>

package/dist/components/page/Footer.svelte

@@ -8,8 +8,8 @@ onMount(async () => {
   content = await getFooter();
   console.log(content);
 });
-</script>
-
-{#if content!=undefined}
-{@html content}
-{/if}
+</script>
+
+{#if content != undefined}
+	{@html content}
+{/if}

package/dist/components/page/Header.svelte

@@ -8,7 +8,8 @@ onMount(async () => {
   content = await getHeader();
   console.log(content);
 });
-</script>
-{#if content!=undefined}
-{@html content}
-{/if}
+</script>
+
+{#if content != undefined}
+	{@html content}
+{/if}

package/dist/components/page/HelpPopUp.svelte

@@ -1,4 +1,4 @@
-<script lang=ts>import { helpStore } from "../../stores/pageStores";
+<script>import { helpStore } from "../../stores/pageStores";
 import Fa from "svelte-fa/src/fa.svelte";
 import { faQuestion } from "@fortawesome/free-solid-svg-icons";
 import { popup } from "@skeletonlabs/skeleton";
@@ -26,27 +26,33 @@ async function resetItemId() {
   await delay(100);
   helpStore.resetItemId();
 }
-</script>
-
-{#if active}
-    <button id="helpButton"class="chip variant-filled-warning fixed bottom-5 right-10 shadow-md" use:popup={helpClick}><Fa icon={faQuestion}/></button>
-
-    <div class="card bg-primary-300 border-solid border-2 border-primary-500 shadow-md" data-popup="helpTarget">
-        {#if helpItem && helpItem.id}
-            <div class="p-5 w-96 space-y-4" id={"helpPopup." + helpItem.id}>
-                <h3 class="h3">{ helpItem.name }</h3> 
-                <p>{@html helpItem.description }</p>
-                {#if helpItem.link}  
-                <p><a class="anchor" href="{helpItem.link}">... read more</a></p>
-                {/if}
-            </div>
-        {:else}
-        <div class="p-5 w-96 space-y-4" id="helpPopup">
-            <h3 class="h3">Help</h3> 
-            <p>Hover over the Element, you like to know more about.</p>
-        </div>
-        {/if}
-        <div class="arrow variant-filled-primary" />
-      </div>
-{/if}
-
+</script>
+
+{#if active}
+	<button
+		id="helpButton"
+		class="chip variant-filled-warning fixed bottom-5 right-10 shadow-md"
+		use:popup={helpClick}><Fa icon={faQuestion} /></button
+	>
+
+	<div
+		class="card bg-primary-300 border-solid border-2 border-primary-500 shadow-md"
+		data-popup="helpTarget"
+	>
+		{#if helpItem && helpItem.id}
+			<div class="p-5 w-96 space-y-4" id={'helpPopup.' + helpItem.id}>
+				<h3 class="h3">{helpItem.name}</h3>
+				<p>{@html helpItem.description}</p>
+				{#if helpItem.link}
+					<p><a class="anchor" href={helpItem.link}>... read more</a></p>
+				{/if}
+			</div>
+		{:else}
+			<div class="p-5 w-96 space-y-4" id="helpPopup">
+				<h3 class="h3">Help</h3>
+				<p>Hover over the Element, you like to know more about.</p>
+			</div>
+		{/if}
+		<div class="arrow variant-filled-primary" />
+	</div>
+{/if}

package/dist/components/page/HelpPopUp.svelte.d.ts

@@ -1,15 +1,3 @@
-/** @typedef {typeof __propDef.props}  HelpPopUpProps */
-/** @typedef {typeof __propDef.events}  HelpPopUpEvents */
-/** @typedef {typeof __propDef.slots}  HelpPopUpSlots */
-export default class HelpPopUp extends SvelteComponentTyped<{
-    active?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}> {
-}
-export type HelpPopUpProps = typeof __propDef.props;
-export type HelpPopUpEvents = typeof __propDef.events;
-export type HelpPopUpSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
@@ -20,4 +8,9 @@ declare const __propDef: {
     };
     slots: {};
 };
+export type HelpPopUpProps = typeof __propDef.props;
+export type HelpPopUpEvents = typeof __propDef.events;
+export type HelpPopUpSlots = typeof __propDef.slots;
+export default class HelpPopUp extends SvelteComponentTyped<HelpPopUpProps, HelpPopUpEvents, HelpPopUpSlots> {
+}
 export {};

package/dist/components/page/Page.svelte

@@ -1,6 +1,6 @@
 <script>import { onMount } from "svelte";
 import { pageContentLayoutType } from "../../models/Enums";
-import { AppShell, AppBar, Modal } from "@skeletonlabs/skeleton";
+import { AppShell, AppBar } from "@skeletonlabs/skeleton";
 import Menu from "./menu/Menu.svelte";
 import Footer from "./Footer.svelte";
 import Header from "./Header.svelte";
@@ -24,69 +24,59 @@ onMount(async () => {
   breadcrumbStore.clean();
   breadcrumbStore.addItem({ label: title, link: window.location.pathname });
 });
-</script>
-
-<AppShell>
-
-  <!--header-->
-  <svelte:fragment slot="header">
-
-    <AppBar padding="0" spacing="space-y-0" background="white">
-      <svelte:fragment slot="headline">
-        <Header/>
-        {#if true}
-        <Menu/>
-        {/if}
-
-        <div class="grid grid-cols-2">
-          <Breadcrumb {title}/>
-          <Docs {links} {note}/>
-        </div>
-      </svelte:fragment>
-    </AppBar>
- 
-  </svelte:fragment>
-
-
-  <svelte:fragment slot="footer">
-   <Footer/>
-  </svelte:fragment>
-
-  <slot name="description" />
-
- <div class="flex flex-initial space-x-5">
-  
-  {#if $$slots.left}
-  <div class="p-5 flex-shrink-0 w-96 w-min-96  border-y border-solid border-surface-500">
-    <slot name="left" />
-  </div>
-  {/if}
-
-  {#if contentLayoutType === pageContentLayoutType.center}
-
-  <div class="flex justify-center w-screen ">
-    <div class="max-w-7xl  p-5 space-y-5 border-y border-solid border-surface-500">
-      <slot/>
-    </div>
-  </div>
-  {/if}
-
-  {#if contentLayoutType === pageContentLayoutType.full}
-  <div class="p-5 space-y-5 border-y border-solid border-surface-500 w-screen">
-     <slot/>
-  </div>
-  
-  {/if}
-
-
-  {#if $$slots.right}
-  <div class=" p-5 flex-shrink-0 w-96  border-y border-solid border-surface-500">
-    <slot name="right"/> 
-  </div> 
-  {/if}
-    						
-  </div>
-
-  <HelpPopUp active={help}/>
-
-</AppShell>
+</script>
+
+<AppShell>
+	<!--header-->
+	<svelte:fragment slot="header">
+		<AppBar padding="0" spacing="space-y-0" background="white">
+			<svelte:fragment slot="headline">
+				<Header />
+				{#if true}
+					<Menu />
+				{/if}
+
+				<div class="grid grid-cols-2">
+					<Breadcrumb {title} />
+					<Docs {links} {note} />
+				</div>
+			</svelte:fragment>
+		</AppBar>
+	</svelte:fragment>
+
+	<svelte:fragment slot="footer">
+		<Footer />
+	</svelte:fragment>
+
+	<slot name="description" />
+
+	<div class="flex flex-initial space-x-5">
+		{#if $$slots.left}
+			<div class="p-5 flex-shrink-0 w-96 w-min-96 border-y border-solid border-surface-500">
+				<slot name="left" />
+			</div>
+		{/if}
+
+		{#if contentLayoutType === pageContentLayoutType.center}
+			<div class="flex justify-center w-screen">
+				<div class="max-w-7xl p-5 space-y-5 border-y border-solid border-surface-500">
+					<slot />
+				</div>
+			</div>
+		{/if}
+
+		{#if contentLayoutType === pageContentLayoutType.full}
+			<div class="p-5 space-y-5 border-y border-solid border-surface-500 w-screen">
+				<slot />
+			</div>
+		{/if}
+
+		{#if $$slots.right}
+			<div class=" p-5 flex-shrink-0 w-96 border-y border-solid border-surface-500">
+				<slot name="right" />
+			</div>
+		{/if}
+	</div>
+
+	<HelpPopUp active={help} />
+</AppShell>

package/dist/components/page/Page.svelte.d.ts

@@ -1,6 +1,6 @@
 import { SvelteComponentTyped } from "svelte";
-import type { linkType } from "../../models/Models";
-import { pageContentLayoutType } from "../../models/Enums";
+import type { linkType } from '../../models/Models';
+import { pageContentLayoutType } from '../../models/Enums';
 declare const __propDef: {
     props: {
         title?: string | undefined;

package/dist/components/page/PageCaller.js

@@ -1,21 +1,19 @@
-import {Api} from "../../services/Api";
-
-
-export const getFooter = async () => {
-    try {
-      const response = await Api.get('/footer');
-      return response.data;
-    } catch (error) {
-      console.error(error);
-    }
-  };
-
-  
-export const getHeader = async () => {
- try {
-   const response = await Api.get('/header');
-   return response.data;
- } catch (error) {
-   console.error(error);
- }
-};
+import { Api } from '../../services/Api';
+
+export const getFooter = async () => {
+	try {
+		const response = await Api.get('/footer');
+		return response.data;
+	} catch (error) {
+		console.error(error);
+	}
+};
+
+export const getHeader = async () => {
+	try {
+		const response = await Api.get('/header');
+		return response.data;
+	} catch (error) {
+		console.error(error);
+	}
+};

package/dist/components/page/Spinner.svelte

@@ -5,15 +5,14 @@ export let position = positionType.center;
 </script>
 
 <div class="flex justify-{position} items-{position} h-full w-full gap-5 pt-2 {textCss}">
-<div
-	class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] "
-	role="status"
->
-	<span
-		class="!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]"
-		>Loading...</span
+	<div
+		class="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]"
+		role="status"
 	>
+		<span
+			class="!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]"
+			>Loading...</span
+		>
+	</div>
+	<span>{label}</span>
 </div>
-<span>{label}</span>
-</div>
-

package/dist/components/page/Spinner.svelte.d.ts

@@ -1,5 +1,5 @@
 import { SvelteComponentTyped } from "svelte";
-import { positionType } from "../../models/Enums";
+import { positionType } from '../../models/Enums';
 declare const __propDef: {
     props: {
         textCss?: string | undefined;

package/dist/components/page/breadcrumb/Breadcrumb.svelte

@@ -7,26 +7,22 @@ $:
   breadcrumbStore.subscribe((value) => {
     list = value?.items;
   });
-</script>
-
-
-<div class="px-5 py-2">
-	<ol class="breadcrumb -p50">
-
-	<!--default home-->
-	<li class="crumb"><a class="anchor" href={"/"}>Home</a></li>
-	<li class="crumb-separator" aria-hidden>&rsaquo;</li>
-
-	{#each list as crumb, i}
-		<!-- If crumb index is less than the breadcrumb length minus 1 -->
-		{#if i < list.length - 1}
-			<li class="crumb"><a class="anchor" href={crumb.link}>{crumb.label}</a></li>
-			<li class="crumb-separator" aria-hidden>&rsaquo;</li>
-		{:else}
-			<li class="crumb">{crumb.label}</li>
-		{/if}
-	{/each}
-</ol>
-</div>
-
-
+</script>
+
+<div class="px-5 py-2">
+	<ol class="breadcrumb -p50">
+		<!--default home-->
+		<li class="crumb"><a class="anchor" href={'/'}>Home</a></li>
+		<li class="crumb-separator" aria-hidden>&rsaquo;</li>
+
+		{#each list as crumb, i}
+			<!-- If crumb index is less than the breadcrumb length minus 1 -->
+			{#if i < list.length - 1}
+				<li class="crumb"><a class="anchor" href={crumb.link}>{crumb.label}</a></li>
+				<li class="crumb-separator" aria-hidden>&rsaquo;</li>
+			{:else}
+				<li class="crumb">{crumb.label}</li>
+			{/if}
+		{/each}
+	</ol>
+</div>