@bexis2/bexis2-core-ui 0.4.96 → 0.4.98

package/dist/components/form/MultiSelect.svelte

@@ -32,10 +32,10 @@
 
 	$: value = '';
 	$: updateTarget(value);
-	$: target, setValue(target);
+	$: (target, setValue(target));
 
 	let groupBy;
-	$: groupBy = itemGroup ? (item) => item[itemGroup] : undefined; 
+	$: groupBy = itemGroup ? (item) => item[itemGroup] : undefined;
 
 	const dispatch = createEventDispatcher();
 
@@ -47,8 +47,6 @@
 			return;
 		}
 
-		
-
 		//console.log('update');
 		//different cases
 		//a) source is complex model is simple return array
@@ -151,28 +149,23 @@
 		if (!isMulti) {
 			//console.log("onmount",complexSource,complexTarget,value,target)
 			if (!complexSource && !complexTarget) {
-
-
-				if(groupBy) { // if groupby is set, the value needs to be set as object with label and value, otherwise the select component does not recognize the value
+				if (groupBy) {
+					// if groupby is set, the value needs to be set as object with label and value, otherwise the select component does not recognize the value
+					value = {
+						value: t,
+						label: t
+					};
+				} else //	if there is no groupby, the value can be set as simple value, otherwise the select component does not recognize the value
+				{
+					if (t === null || t === undefined || t === '') {
+						value = '';
+					} else {
 						value = {
-								value: t,
-								label: t
-							};
+							value: t,
+							label: t
+						};
 					}
-					else //	if there is no groupby, the value can be set as simple value, otherwise the select component does not recognize the value
-					{
-							if(t === null || t === undefined || t === '') {
-									value = ''
-								}
-								else
-								{
-									value = {
-										value: t,
-										label: t
-									};
-								}
-					}
-				
+				}
 			}
 
 			if (complexSource && complexTarget) {
@@ -304,13 +297,22 @@
 			target = '';
 		}
 
-		dispatch('clear', e)
-
+		dispatch('clear', e);
 	}
-	
 </script>
 
-<InputContainer {id} label={title} {feedback} {required} {help} {description} {showDescription} {showIcon} on:showDescription on:hideDescription>
+<InputContainer
+	{id}
+	label={title}
+	{feedback}
+	{required}
+	{help}
+	{description}
+	{showDescription}
+	{showIcon}
+	on:showDescription
+	on:hideDescription
+>
 	<Select
 		{id}
 		items={source}
@@ -320,7 +322,6 @@
 		multiple={isMulti}
 		bind:value
 		{placeholder}
-
 		hasError={invalid}
 		{loading}
 		{clearable}

package/dist/components/form/NumberInput.svelte

@@ -24,7 +24,18 @@ $: if (min != void 0 && parseInt(value) < min) {
 }
 </script>
 
-<InputContainer {id} {label} {feedback} {required} {help} {description} {showDescription} {showIcon} on:showDescription on:hideDescription>
+<InputContainer
+	{id}
+	{label}
+	{feedback}
+	{required}
+	{help}
+	{description}
+	{showDescription}
+	{showIcon}
+	on:showDescription
+	on:hideDescription
+>
 	<input
 		{id}
 		class="input variant-form-material dark:bg-zinc-700 bg-zinc-50 placeholder:text-gray-400"

package/dist/components/form/TextArea.svelte

@@ -14,7 +14,18 @@ export let showDescription = false;
 export let showIcon = false;
 </script>
 
-<InputContainer {id} {label} {feedback} {required} {help} {description} {showDescription} {showIcon} on:showDescription on:hideDescription>
+<InputContainer
+	{id}
+	{label}
+	{feedback}
+	{required}
+	{help}
+	{description}
+	{showDescription}
+	{showIcon}
+	on:showDescription
+	on:hideDescription
+>
 	<textarea
 		{id}
 		class="textarea variant-form-material dark:bg-zinc-700 bg-zinc-50 placeholder:text-gray-400"

package/dist/components/form/TextInput.svelte

@@ -14,7 +14,18 @@ export let showDescription = false;
 export let showIcon = false;
 </script>
 
-<InputContainer {id} {label} {feedback} {required} {help} {description} {showDescription} {showIcon} on:showDescription on:hideDescription>
+<InputContainer
+	{id}
+	{label}
+	{feedback}
+	{required}
+	{help}
+	{description}
+	{showDescription}
+	{showIcon}
+	on:showDescription
+	on:hideDescription
+>
 	<input
 		{id}
 		class="input variant-form-material dark:bg-zinc-700 bg-zinc-50 placeholder:text-gray-400"

package/dist/components/page/Alert.svelte

@@ -27,7 +27,11 @@ $: show = true;
 			<slot name="actions" />
 
 			{#if deleteBtn}
-				<button class="btn hover:text-primary-100" title="Close alert" on:click={() => (show = false)}>
+				<button
+					class="btn hover:text-primary-100"
+					title="Close alert"
+					on:click={() => (show = false)}
+				>
 					<Fa icon={faXmark} />
 				</button>
 			{/if}

package/dist/components/page/BackToTop.svelte

@@ -26,5 +26,7 @@
 <svelte:window on:scroll={handleOnScroll} />
 
 <div class="w-full items-center">
-	<button class="btn ring back-to-top" title="Back to top" on:click={goTop} class:hidden>Back to top</button>
+	<button class="btn ring back-to-top" title="Back to top" on:click={goTop} class:hidden
+		>Back to top</button
+	>
 </div>

package/dist/components/page/Docs.svelte

@@ -29,9 +29,16 @@ const noteSettings = {
 	{/if}
 
 	{#each links as link}
-		<span role="button" tabindex="0" title={link.label} class="chip variant-soft hover:variant-filled" on:click={() => goTo(link.url, false)} on:keypress={() => goTo(link.url, false)}>
+		<span
+			role="button"
+			tabindex="0"
+			title={link.label}
+			class="chip variant-soft hover:variant-filled"
+			on:click={() => goTo(link.url, false)}
+			on:keypress={() => goTo(link.url, false)}
+		>
 			<span>
-				{#if link.label.toLowerCase()=='manual'}
+				{#if link.label.toLowerCase() == 'manual'}
 					<Fa icon={faBook} />
 				{:else}
 					{link.label}

package/dist/components/page/GoToTop.svelte

@@ -1,26 +1,25 @@
 <script>
+	import Fa from 'svelte-fa';
+	import { faAngleUp } from '@fortawesome/free-solid-svg-icons';
 
- import Fa from 'svelte-fa';
- import { faAngleUp } from '@fortawesome/free-solid-svg-icons';
+	export let showAtPixel = 1000;
 
- export let showAtPixel = 1000;
+	let scrollHeight = 0;
 
- let scrollHeight = 0;
+	const gotoTop = () => {
+		window.scrollTo({ top: 0, behavior: 'smooth' });
+	};
 
- const gotoTop = () => {
-  window.scrollTo({ top: 0, behavior: 'smooth' })
- };
-
- $: showGotoTop = scrollHeight > showAtPixel;
+	$: showGotoTop = scrollHeight > showAtPixel;
 </script>
 
 {#if showGotoTop}
- <button
- id="gotToTop"
- title="Go to top"
- class="btn variant-filled-warning fixed bottom-5 right-20 shadow-md"
- on:click={gotoTop}
- ><Fa icon={faAngleUp}/></button >
+	<button
+		id="gotToTop"
+		title="Go to top"
+		class="btn variant-filled-warning fixed bottom-5 right-20 shadow-md"
+		on:click={gotoTop}><Fa icon={faAngleUp} /></button
+	>
 {/if}
 
 <svelte:window bind:scrollY={scrollHeight} />

package/dist/components/page/Page.svelte

@@ -50,70 +50,64 @@ function scrollToTop() {
 </script>
 
 <div class="app" bind:this={app}>
-<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 bind:title />
-					<Docs {links} {note} />
-				</div>
-			</svelte:fragment>
-		</AppBar>
-	</svelte:fragment>
+	<AppShell>
+		<!--header-->
+		<svelte:fragment slot="header">
+			<AppBar padding="0" spacing="space-y-0" background="white">
+				<svelte:fragment slot="headline">
+					<Header />
+					{#if true}
+						<Menu />
+					{/if}
 
-	<slot name="description" />
+					<div class="grid grid-cols-2">
+						<Breadcrumb bind:title />
+						<Docs {links} {note} />
+					</div>
+				</svelte:fragment>
+			</AppBar>
+		</svelte:fragment>
 
-	{#if aftIsReady}
+		<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 aftIsReady}
+			<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="w-full max-w-7xl p-5 space-y-5 border-y border-solid border-surface-500">
-					<slot />
-				</div>
-			</div>
-		{/if}
+				{#if contentLayoutType === pageContentLayoutType.center}
+					<div class="flex justify-center w-screen">
+						<div class="w-full 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 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 fixed flex-shrink-0 w-96 border-y border-solid border-surface-500">
-				<slot name="right" />
+				{#if $$slots.right}
+					<div class=" p-5 fixed flex-shrink-0 w-96 border-y border-solid border-surface-500">
+						<slot name="right" />
+					</div>
+				{/if}
 			</div>
 		{/if}
-	</div>
-
-	{/if}
-
-	<GoToTop/>
-	<HelpPopUp active={help} />
-	<Notification />
-
-	
-	<svelte:fragment slot="footer">
-		{#if footer}
-			<Footer />
-		{/if}
 
-	</svelte:fragment>
+		<GoToTop />
+		<HelpPopUp active={help} />
+		<Notification />
 
-</AppShell>
+		<svelte:fragment slot="footer">
+			{#if footer}
+				<Footer />
+			{/if}
+		</svelte:fragment>
+	</AppShell>
 </div>
-

package/dist/components/page/breadcrumb/BreadcrumbDataCaller.js

@@ -1,19 +1,15 @@
 import { Api } from '../../../services/Api';
 
 export const getApplicationName = async () => {
-    try
-    {
-        const response = await Api.get(`/Home/GetApplicationName`);
+	try {
+		const response = await Api.get(`/Home/GetApplicationName`);
 
-        if(response.status == 200)
-        {
-            return response.data;
-        }
-        else
-        {
-            return "BEXIS2";
-        }
-    } catch (error) {
-        return "BEXIS2"
-    }
-}
+		if (response.status == 200) {
+			return response.data;
+		} else {
+			return 'BEXIS2';
+		}
+	} catch (error) {
+		return 'BEXIS2';
+	}
+};

package/dist/components/page/menu/MenuAccountBar.svelte

@@ -8,12 +8,8 @@ let comboboxValue;
 
 {#if menuBar}
 	<div class="h-full place-self-center sm:flex gap-2 w-full sm:w-auto">
-
 		{#each menuBar as menubarItem}
-
-				<Item {menubarItem} {comboboxValue} />
-
+			<Item {menubarItem} {comboboxValue} />
 		{/each}
-
 	</div>
 {/if}

package/dist/components/page/menu/MenuDataCaller.js

@@ -3,7 +3,7 @@ import { Api } from '../../../services/Api';
 export const getMenuItems = async () => {
 	try {
 		const response = await Api.get('/menu');
-		
+
 		return response.data;
 	} catch (error) {
 		console.error(error);

package/dist/components/page/menu/MenuItem.svelte

@@ -16,10 +16,11 @@ let popupCombobox = {
 
 {#if menubarItem.Items.length < 1}
 	<div class="p-2">
-
-		<button id={id+"bt"} class="grid" use:popup={popupCombobox} >
-			<a class="grid" href={menubarItem.Url} target="{menubarItem.Target}">
-				<span class="capitalize whitespace-nowrap text-lg hover:text-secondary-500">{comboboxValue ?? menubarItem.Title}</span>
+		<button id={id + 'bt'} class="grid" use:popup={popupCombobox}>
+			<a class="grid" href={menubarItem.Url} target={menubarItem.Target}>
+				<span class="capitalize whitespace-nowrap text-lg hover:text-secondary-500"
+					>{comboboxValue ?? menubarItem.Title}</span
+				>
 			</a>
 		</button>
 	</div>
@@ -34,12 +35,13 @@ let popupCombobox = {
 			<svelte:fragment slot="content"
 				><MenuSublist {id} items={menubarItem.Items} /></svelte:fragment
 			>
-			</AccordionItem
-		>
+		</AccordionItem>
 	</div>
 	<div class="hidden sm:block place-self-center" use:popup={popupCombobox}>
 		<button id={idLabel} class="flex items-center gap-x-1 px-2">
-			<span class="capitalize text-lg whitespace-nowrap hover:text-secondary-500">{menubarItem.Title}▾</span>
+			<span class="capitalize text-lg whitespace-nowrap hover:text-secondary-500"
+				>{menubarItem.Title}▾</span
+			>
 		</button>
 
 		<div class="z-50 w-max" data-popup={id}>

package/dist/components/page/menu/MenuSublist.svelte

@@ -54,14 +54,16 @@ async function logOffFn() {
 		<ListBoxItem
 			class="text-md sm:text-sm text-surface-800 py-1 hover:text-secondary-500 bg-transparent hover:bg-surface-200"
 			bind:group={item.Title}
-
 			name="medium"
 			value={item.Title}
-	
 		>
-		<a id={"menu-"+item.Title.replaceAll(' ', '-')}  href={item.Url} target="{item.Target}" class="w-full block" on:click|preventDefault={()=>clickFn(item)}>{item.Title}</a>
-
+			<a
+				id={'menu-' + item.Title.replaceAll(' ', '-')}
+				href={item.Url}
+				target={item.Target}
+				class="w-full block"
+				on:click|preventDefault={() => clickFn(item)}>{item.Title}</a
+			>
 		</ListBoxItem>
-
 	{/each}
 </ListBox>

package/dist/components/page/menu/SettingsBar.svelte

@@ -18,7 +18,10 @@ let popupCombobox = {
 	<div class="sm:hidden">
 		<AccordionItem padding="p-2">
 			<svelte:fragment slot="summary"
-				><button id="settings" class="flex items-center gap-x-1 text-sm text-surface-800 w-5 h-full">
+				><button
+					id="settings"
+					class="flex items-center gap-x-1 text-sm text-surface-800 w-5 h-full"
+				>
 					<span class="capitalize"><Fa icon={faCog} /></span>
 				</button></svelte:fragment
 			>

package/dist/components/toggle/Toggle.svelte

@@ -26,25 +26,25 @@ $: mode;
 
 <div
 	class="lightswitch-track {classesTrack}"
-	on:click={()=>mode=!mode}
+	on:click={() => (mode = !mode)}
 	on:click
-	on:keydown={()=>mode=!mode}
+	on:keydown={() => (mode = !mode)}
 	on:keydown
 	on:keyup
 	on:keypress
 	role="switch"
 	aria-label="Light Switch"
- aria-checked={mode}
+	aria-checked={mode}
 	title="xyz"
 	tabindex="0"
 >
 	<!-- Thumb -->
 	<div class="lightswitch-thumb {classesThumb}">
 		<!-- SVG -->
-  {#if mode}
-  <Fa icon={faPen} color="white" />
-  {:else}
-  <Fa icon={faTrash} />
-  {/if}
+		{#if mode}
+			<Fa icon={faPen} color="white" />
+		{:else}
+			<Fa icon={faTrash} />
+		{/if}
 	</div>
-</div>
+</div>

package/dist/css/core.ui.postcss

@@ -22,7 +22,7 @@ h2 {
 }
 
 input {
-	@apply pb-1 pt-1
+	@apply pb-1 pt-1;
 }
 
 .svelte-select,
@@ -37,4 +37,3 @@ input {
 .list-item .item.hover:not(.active):not(.list-group-title) {
 	@apply dark:!text-black;
 }
-

package/dist/services/Api.js

@@ -11,7 +11,7 @@ const apiRequest = (method, url, request, customHeaders = {}, customConfig = {})
     const requestVerificationToken = csrfToken;
     const headers = {
         authorization: 'Basic ' + btoa(username + ':' + password),
-        '__RequestVerificationToken': requestVerificationToken,
+        __RequestVerificationToken: requestVerificationToken,
         ...customHeaders
     };
     //using the axios instance to perform the request that received from each http method
@@ -27,16 +27,16 @@ const apiRequest = (method, url, request, customHeaders = {}, customConfig = {})
         return Promise.resolve(res);
     })
         .catch((er) => {
-        console.log("🚀 ~ apiRequest ~ err:", er);
+        console.log('🚀 ~ apiRequest ~ err:', er);
         const err = er.response;
         let error = {
             status: err.status,
             statusText: err.statusText,
             error: err.data.error,
-            stackTrace: err.data.stackTrace,
+            stackTrace: err.data.stackTrace
         };
         errorStore.set(error);
-        console.log("🚀 ~ apiRequest ~ error:", error);
+        console.log('🚀 ~ apiRequest ~ error:', error);
         return Promise.reject(new Error(error.error));
     });
 };

package/dist/services/BaseCaller.js

@@ -3,7 +3,7 @@
 import { host } from '../stores/apiStores';
 
 // go to a internal action
-export const goTo = async (url, intern = true, target="_self") => {
+export const goTo = async (url, intern = true, target = '_self') => {
 	if (intern == true) {
 		// go to inside bexis2
 		if (window != null && host != null && url != null) {