@bagelink/vue 0.0.413 → 0.0.417

package/dist/types/BagelForm.d.ts

@@ -1,4 +1,5 @@
 import { SelectInput, TextInput } from '..';
+
 export type AttributeValue = string | number | boolean | null | undefined | Record<string, any>;
 export type AttributeFn<T = Record<string, any>> = (field: any, row: T) => AttributeValue;
 export interface Attributes<T = any> {

package/dist/types/BtnOptions.d.ts

@@ -1,4 +1,5 @@
-import type { ThemeType, MaterialIcons } from '.';
+import { ThemeType, MaterialIcons } from '.';
+
 export interface BtnOptions {
     onClick?: () => void;
     color?: ThemeType;

package/dist/types/NavLink.d.ts

@@ -1,4 +1,5 @@
 import { MaterialIcons } from './materialIcons';
+
 export type NavLink = {
     label: string;
     to?: string;

package/dist/types/index.d.ts

@@ -1,5 +1,5 @@
+import { MaterialIcons } from './materialIcons';
 export type { ModalFormComponentProps, ModalApi, ModalComponentProps, ModalFormOptions, ModalOptions, } from '../plugins/modal';
-import type { MaterialIcons } from './materialIcons';
 export type { MaterialIcons };
 export type { Tables, TableToTypeMapping } from '../../../sdk/src/index.ts';
 export type { StorageFile } from './file';

package/dist/utils/BagelFormUtils.d.ts

@@ -1,4 +1,5 @@
-import type { Field } from '..';
+import { Field } from '..';
+
 export type Option = string | number | Record<string, any> | {
     label: string;
     value: string | number;

package/dist/utils/clickOutside.d.ts

@@ -1,4 +1,5 @@
-import type { DirectiveBinding } from 'vue';
+import { DirectiveBinding } from 'vue';
+
 declare const _default: {
     beforeMount(el: any, binding: DirectiveBinding): void;
     unmounted(el: any): void;

package/dist/utils/index.d.ts

@@ -1,7 +1,8 @@
 import { Attributes } from '../types';
+
 export declare const debounce: (fn: () => void, delay?: number) => void;
 export declare const keyToLabel: (key?: string) => string | undefined;
-export declare const copyText: (text: string, cb?: ((msg: string) => void) | undefined) => Promise<void>;
+export declare const copyText: (text: string, cb?: (msg: string) => void) => Promise<void>;
 export declare const initials: (...strArr: string[]) => string;
 export declare function useEscape(event: KeyboardEvent, closeModel: () => void): void;
 export declare function classify(fieldVal?: any, row?: any, ...classes: any[]): string;

package/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAGtC,eAAO,MAAM,QAAQ,OAAQ,MAAM,IAAI,yBAGtC,CAAC;AAEF,eAAO,MAAM,UAAU,SAAU,MAAM,KAAG,MAAM,GAAG,SAEjC,CAAC;AAEnB,eAAO,MAAM,QAAQ,SACd,MAAM,cAED,MAAM,KAAK,IAAI,+BAI1B,CAAC;AAEF,eAAO,MAAM,QAAQ,cAAe,MAAM,EAAE,WAG3C,CAAC;AAEF,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,IAAI,QAIrE;AAED,wBAAgB,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,GAAG,EAAE,UAKpE;AAED,wBAAgB,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,OAS7F;AAED,eAAO,MAAM,KAAK,UAAW,GAAG,YAAY,GAAG,QAM9C,CAAC;AAEF,eAAO,MAAM,SAAS,cAAe,OAAO,MAAM,EAAE,GAAG,CAAC,YAAY,MAAM,QAAqD,CAAC;AAEhI,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzC,OAAO,KAAK,cAAc,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAGtC,eAAO,MAAM,QAAQ,OAAQ,MAAM,IAAI,yBAGtC,CAAC;AAEF,eAAO,MAAM,UAAU,SAAU,MAAM,KAAG,MAAM,GAAG,SAEjC,CAAC;AAEnB,eAAO,MAAM,QAAQ,SACd,MAAM,OAEP,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,kBAI1B,CAAC;AAEF,eAAO,MAAM,QAAQ,cAAe,MAAM,EAAE,WAG3C,CAAC;AAEF,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,IAAI,QAIrE;AAED,wBAAgB,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,GAAG,EAAE,UAKpE;AAED,wBAAgB,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,OAS7F;AAED,eAAO,MAAM,KAAK,UAAW,GAAG,YAAY,GAAG,QAM9C,CAAC;AAEF,eAAO,MAAM,SAAS,cAAe,OAAO,MAAM,EAAE,GAAG,CAAC,YAAY,MAAM,QAAqD,CAAC;AAEhI,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzC,OAAO,KAAK,cAAc,MAAM,kBAAkB,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "0.0.413",
+  "version": "0.0.417",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Neveh Allon",

package/src/components/Avatar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="avatar" :style="{ width: `${size}px`, height: `${size}px` }">
+  <div class="avatar flex" :style="{ width: `${size}px`, height: `${size}px` }">
     <img v-if="src" :src="src" :alt="name">
     <p v-else :style="{ 'line-height': `${size}px`, 'font-size': `calc(1.5rem * ${size} / 50)` }">
       {{ fallback || initials(name || '') }}
@@ -26,6 +26,7 @@ withDefaults(defineProps<{
   overflow: hidden;
   text-align: center;
   padding: 0;
+  flex-shrink: 0;
 }
 
 .avatar p {

package/src/components/NavBar.vue

@@ -2,9 +2,12 @@
 	<div :class="{ open: isOpen, closed: !isOpen }">
 		<slot name="top" />
 		<div
-			class="nav-expend" @click="isOpen = !isOpen" @keypress.enter="isOpen = !isOpen" role="button"
-			aria-label="Toggle Navigation" tabindex="0"
-		>
+			class="nav-expend"
+			@click="isOpen = !isOpen"
+			@keypress.enter="isOpen = !isOpen"
+			role="button"
+			aria-label="Toggle Navigation"
+			tabindex="0">
 			<MaterialIcon icon="chevron_right" class="top-arrow" />
 		</div>
 
@@ -12,9 +15,12 @@
 			<div class="nav-scroll">
 				<div class="nav-links-wrapper">
 					<component
-						:is="link.to?'router-link':'div'" v-for="link in links" class="nav-button" :to="link.to"
-						:key="link.label" @click="link.onClick?.()"
-					>
+						:is="link.to ? 'router-link' : 'div'"
+						v-for="link in links"
+						class="nav-button"
+						:to="link.to"
+						:key="link.label"
+						@click="link.onClick?.()">
 						<MaterialIcon :icon="link.icon" />
 						<div class="tooltip">
 							{{ link.label }}
@@ -25,9 +31,12 @@
 
 			<div class="bot-buttons-wrapper">
 				<component
-					:is="link.to?'router-link':'div'" v-for="link in footerLinks" class="nav-button" :to="link.to"
-					@click="link.onClick?.()" :key="link.label"
-				>
+					:is="link.to ? 'router-link' : 'div'"
+					v-for="link in footerLinks"
+					class="nav-button"
+					:to="link.to"
+					@click="link.onClick?.()"
+					:key="link.label">
 					<MaterialIcon :icon="link.icon" />
 					<div class="tooltip">
 						{{ link.label }}
@@ -47,46 +56,46 @@ const isOpen = $ref(true);
 
 withDefaults(
 	defineProps<{
-    footerLinks?: NavLink[];
-    links?: NavLink[];
-    homeIcon?: MaterialIcons;
-    homeLabel?: string;
-    homeTo?: string;
-  }>(),
+		footerLinks?: NavLink[];
+		links?: NavLink[];
+		homeIcon?: MaterialIcons;
+		homeLabel?: string;
+		homeTo?: string;
+	}>(),
 	{
 		homeIcon: 'home',
 		homeLabel: 'Home',
 		homeTo: '/',
 		links: () => [],
 		footerLinks: () => [],
-	},
+	}
 );
 </script>
 
 <style scoped>
-[dir="rtl"] .top-arrow {
-  transform: rotate(180deg);
+[dir='rtl'] .top-arrow {
+	transform: rotate(180deg);
 }
 
 .nav-expend {
-  text-align: center;
-  cursor: pointer;
-  background: var(--bgl-white);
-  color: var(--bgl-primary);
-  display: flex;
-  border-radius: 100%;
-  font-size: 13px;
-  box-shadow: 0 0 50px 0 var(--bgl-shadow);
-  height: 22px;
-  width: 22px;
-  align-items: center;
-  justify-content: center;
-  position: absolute;
-  top: 82px;
-  box-sizing: border-box;
-  padding-inline-start: 2px;
-  margin-inline-start: 55px;
-  transition: all 0.4s cubic-bezier(0.36, 0.02, 0.23, 1);
+	text-align: center;
+	cursor: pointer;
+	background: var(--bgl-white);
+	color: var(--bgl-primary);
+	display: flex;
+	border-radius: 100%;
+	font-size: 13px;
+	box-shadow: 0 0 50px 0 var(--bgl-shadow);
+	height: 22px;
+	width: 22px;
+	align-items: center;
+	justify-content: center;
+	position: absolute;
+	top: 82px;
+	box-sizing: border-box;
+	padding-inline-start: 2px;
+	margin-inline-start: 55px;
+	transition: all 0.4s cubic-bezier(0.36, 0.02, 0.23, 1);
 }
 
 /*
@@ -96,260 +105,260 @@ withDefaults(
 */
 
 .nav-expend {
-  background: var(--bgl-white);
+	background: var(--bgl-white);
 }
 
 .nav-expend:hover {
-  filter: brightness(95%);
-  box-shadow: 0 0 20px 0 var(--bgl-primary-tint);
+	filter: brightness(95%);
+	box-shadow: 0 0 20px 0 var(--bgl-primary-tint);
 }
 
 .nav-expend:active {
-  filter: var(--bgl-active-filter);
+	filter: var(--bgl-active-filter);
 }
 
 .nav {
-  color: var(--bgl-white);
-  background: var(--bgl-primary);
-  z-index: 100;
-  width: 70px;
-  transition: all 0.4s cubic-bezier(0.36, 0.02, 0.23, 1);
-  display: flex;
-  flex-direction: column;
+	color: var(--bgl-white);
+	background: var(--bgl-primary);
+	z-index: 100;
+	width: 70px;
+	transition: all 0.4s cubic-bezier(0.36, 0.02, 0.23, 1);
+	display: flex;
+	flex-direction: column;
 }
 
 .nav * {
-  user-select: none;
+	user-select: none;
 }
 
 .nav-button {
-  text-decoration: none;
-  cursor: pointer;
-  display: flex;
-  text-align: start;
-  align-items: center;
-  position: relative;
-  color: var(--bgl-white);
-  transition: all 0.2s ease;
-  pointer-events: none;
+	text-decoration: none;
+	cursor: pointer;
+	display: flex;
+	text-align: start;
+	align-items: center;
+	position: relative;
+	color: var(--bgl-white);
+	transition: all 0.2s ease;
+	pointer-events: none;
 }
 
 .nav-button:hover {
-  width: fit-content;
-  pointer-events: all;
+	width: fit-content;
+	pointer-events: all;
 }
 
 .nav-button .bgl_icon-font {
-  font-size: 22px;
-  margin: 0.25rem 10px;
-  padding: 10px;
-  width: 50px;
-  text-align: center;
-  height: 45px;
-  flex-grow: 0;
-  flex-shrink: 0;
-  border-radius: 10px;
-  transition: all 0.2s ease;
-  pointer-events: all;
+	font-size: 22px;
+	margin: 0.25rem 10px;
+	padding: 10px;
+	width: 50px;
+	text-align: center;
+	height: 45px;
+	flex-grow: 0;
+	flex-shrink: 0;
+	border-radius: 10px;
+	transition: all 0.2s ease;
+	pointer-events: all;
 }
 
 .nav-button:hover .bgl_icon-font,
 .nav-button.router-link-active .bgl_icon-font {
-  background: var(--bgl-white);
-  color: var(--bgl-primary);
+	background: var(--bgl-white);
+	color: var(--bgl-primary);
 }
 
 .nav-button:hover .tooltip {
-  opacity: 1;
-  pointer-events: all;
+	opacity: 1;
+	pointer-events: all;
 }
 
 .tooltip {
-  background-color: var(--bgl-white);
-  color: var(--bgl-primary);
-  line-height: 1;
-  padding: 0.5rem;
-  border-radius: 10px;
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
-  transition: all 0.2s ease;
-  border: 5px solid transparent;
-  white-space: nowrap;
-  pointer-events: none;
-  opacity: 0;
-  margin-inline-start: 1rem;
+	background-color: var(--bgl-white);
+	color: var(--bgl-primary);
+	line-height: 1;
+	padding: 0.5rem;
+	border-radius: 10px;
+	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+	transition: all 0.2s ease;
+	border: 5px solid transparent;
+	white-space: nowrap;
+	pointer-events: none;
+	opacity: 0;
+	margin-inline-start: 1rem;
 }
 
 .tooltip:hover {
-  filter: brightness(95%);
+	filter: brightness(95%);
 }
 
 .tooltip:active {
-  filter: brightness(90%);
+	filter: brightness(90%);
 }
 
 .bot-buttons-wrapper {
-  margin-top: auto;
-  width: 100%;
+	margin-top: auto;
+	width: 100%;
 }
 
 .nav-links-wrapper {
-  direction: ltr;
+	direction: ltr;
 }
 
-[dir="rtl"] .nav-links-wrapper {
-  direction: rtl;
+[dir='rtl'] .nav-links-wrapper {
+	direction: rtl;
 }
 
 .nav-scroll {
-  overflow-y: scroll;
-  width: 50vw;
-  direction: rtl;
-  text-align: end;
-  margin-inline-end: -7px;
-  pointer-events: none;
-  display: flex;
-  flex-direction: column;
+	overflow-y: scroll;
+	width: 50vw;
+	direction: rtl;
+	text-align: end;
+	margin-inline-end: -7px;
+	pointer-events: none;
+	display: flex;
+	flex-direction: column;
 }
 
 .nav::-webkit-scrollbar-thumb {
-  background-color: transparent;
+	background-color: transparent;
 }
 
 .nav:hover::-webkit-scrollbar-thumb {
-  background-color: var(--bgl-gray);
+	background-color: var(--bgl-gray);
 }
 
-[dir="rtl"] .nav-scroll {
-  direction: ltr;
+[dir='rtl'] .nav-scroll {
+	direction: ltr;
 }
 
 .full-nav {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
 }
 
 @media screen and (min-width: 910px) {
-  .nav.open .nav-expend {
-    margin-inline-start: 189px;
-    transform: rotate(180deg);
-  }
-
-  .nav.open {
-    width: 200px;
-    text-align: start;
-  }
-
-  .nav.open .tooltip {
-    background-color: transparent;
-    color: var(--bgl-white);
-    padding: 0;
-    box-shadow: none;
-    pointer-events: all;
-    opacity: 1;
-    margin-inline-start: 0rem;
-  }
-
-  .nav.open .nav-button .bgl_icon-font {
-    margin: 0;
-    background: transparent;
-  }
-
-  .nav.open .nav-button {
-    width: 180px;
-    border-radius: 10px;
-    margin-inline-start: 10px;
-    margin-top: 10px;
-    margin-bottom: 10px;
-  }
-
-  .nav.open .nav-button:hover,
-  .nav.open .nav-button.router-link-active {
-    background: var(--bgl-white);
-    color: var(--bgl-primary);
-  }
-
-  .nav.open .nav-button:hover,
-  .nav.open .nav-button:hover .tooltip,
-  .nav.open .nav-button.router-link-active .tooltip {
-    color: var(--bgl-primary);
-  }
+	.nav.open .nav-expend {
+		margin-inline-start: 189px;
+		transform: rotate(180deg);
+	}
+
+	.nav.open {
+		width: 200px;
+		text-align: start;
+	}
+
+	.nav.open .tooltip {
+		background-color: transparent;
+		color: var(--bgl-white);
+		padding: 0;
+		box-shadow: none;
+		pointer-events: all;
+		opacity: 1;
+		margin-inline-start: 0rem;
+	}
+
+	.nav.open .nav-button .bgl_icon-font {
+		margin: 0;
+		background: transparent;
+	}
+
+	.nav.open .nav-button {
+		width: 180px;
+		border-radius: 10px;
+		margin-inline-start: 10px;
+		margin-top: 10px;
+		margin-bottom: 10px;
+	}
+
+	.nav.open .nav-button:hover,
+	.nav.open .nav-button.router-link-active {
+		background: var(--bgl-white);
+		color: var(--bgl-primary);
+	}
+
+	.nav.open .nav-button:hover,
+	.nav.open .nav-button:hover .tooltip,
+	.nav.open .nav-button.router-link-active .tooltip {
+		color: var(--bgl-primary);
+	}
 }
 
 @media screen and (max-width: 910px) {
-  .full-nav {
-    height: auto;
-    display: flex;
-    flex-direction: row;
-    width: calc(100vw - 70px);
-    position: absolute;
-    inset-inline-end: 0;
-    overflow-x: auto;
-  }
-
-  .nav.open {
-    width: initial;
-  }
-
-  .nav {
-    width: auto;
-    display: flex;
-    flex-direction: row;
-    margin: 0;
-    overflow-x: auto;
-    justify-content: flex-start;
-  }
-
-  .tooltip {
-    opacity: 1;
-    background: transparent;
-    color: var(--bgl-white);
-    box-shadow: none;
-    font-size: 10px;
-    padding: 0;
-    margin: 0;
-  }
-
-  .nav-button {
-    flex-direction: column;
-    margin: 12px 0.25rem;
-  }
-
-  .nav-button .bgl_icon-font {
-    padding: 2px 0 0 0;
-    margin: 0;
-    height: 30px;
-    width: 30px;
-  }
-
-  .nav-links-wrapper {
-    display: flex;
-  }
-
-  .bot-buttons-wrapper {
-    margin-top: 0;
-    width: auto;
-    display: flex;
-  }
-
-  .nav-scroll {
-    overflow-y: visible;
-    width: auto;
-    direction: auto;
-    text-align: start;
-    margin-inline-end: 0px;
-    pointer-events: all;
-    display: flex;
-    flex-direction: row;
-    margin-inline-end: auto;
-  }
-
-  .nav::-webkit-scrollbar {
-    display: none;
-  }
-
-  .nav-expend {
-    display: none;
-  }
+	.full-nav {
+		height: auto;
+		display: flex;
+		flex-direction: row;
+		width: calc(100vw - 70px);
+		position: absolute;
+		inset-inline-end: 0;
+		overflow-x: auto;
+	}
+
+	.nav.open {
+		width: initial;
+	}
+
+	.nav {
+		width: auto;
+		display: flex;
+		flex-direction: row;
+		margin: 0;
+		overflow-x: auto;
+		justify-content: flex-start;
+	}
+
+	.tooltip {
+		opacity: 1;
+		background: transparent;
+		color: var(--bgl-white);
+		box-shadow: none;
+		font-size: 10px;
+		padding: 0;
+		margin: 0;
+	}
+
+	.nav-button {
+		flex-direction: column;
+		margin: 12px 0.25rem;
+	}
+
+	.nav-button .bgl_icon-font {
+		padding: 2px 0 0 0;
+		margin: 0;
+		height: 30px;
+		width: 30px;
+	}
+
+	.nav-links-wrapper {
+		display: flex;
+	}
+
+	.bot-buttons-wrapper {
+		margin-top: 0;
+		width: auto;
+		display: flex;
+	}
+
+	.nav-scroll {
+		overflow-y: visible;
+		width: auto;
+		direction: auto;
+		text-align: start;
+		margin-inline-end: 0px;
+		pointer-events: all;
+		display: flex;
+		flex-direction: row;
+		margin-inline-end: auto;
+	}
+
+	.nav::-webkit-scrollbar {
+		display: none;
+	}
+
+	.nav-expend {
+		display: none;
+	}
 }
 </style>