@bagelink/vue 1.2.39 → 1.2.41

package/dist/style.css

@@ -310,45 +310,67 @@ display: block;
 	border-radius: var(--input-border-radius);
 }
 
-.agenda-view[data-v-520aee85] {
+.custom-popover[data-v-6f51f6b3] {
+  position: fixed;
+  z-index: 1000;
+  min-width: 250px;
+  max-width: 350px;
+  background-color: white;
+  border-radius: var(--btn-border-radius);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  animation: fadeIn-6f51f6b3 0.2s ease;
+  transform-origin: center left;
+}
+@keyframes fadeIn-6f51f6b3 {
+from {
+    opacity: 0;
+    transform: scale(0.95);
+}
+to {
+    opacity: 1;
+    transform: scale(1);
+}
+}
+
+.agenda-view[data-v-1e2b483b] {
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow: hidden;
 }
-.agenda-header[data-v-520aee85] {
+.agenda-header[data-v-1e2b483b] {
   display: flex;
   padding: 0.5rem;
   border-bottom: 1px solid var(--border-color);
 }
-.time-column[data-v-520aee85] {
+.time-column[data-v-1e2b483b] {
   width: 100px;
   flex-shrink: 0;
 }
-.event-column[data-v-520aee85] {
+.event-column[data-v-1e2b483b] {
   flex-grow: 1;
 }
-.agenda-content[data-v-520aee85] {
+.agenda-content[data-v-1e2b483b] {
   flex-grow: 1;
   overflow-y: auto;
   padding: 1rem;
 }
-.event[data-v-520aee85] {
+.event[data-v-1e2b483b] {
   margin-bottom: 1rem;
   border-radius: 4px;
   overflow: hidden;
   cursor: pointer;
   transition: all 0.2s ease;
 }
-.event[data-v-520aee85]:hover {
+.event[data-v-1e2b483b]:hover {
   transform: scale(1.01);
 }
-.event-content[data-v-520aee85] {
+.event-content[data-v-1e2b483b] {
   display: flex;
   height: 100%;
   color: white;
 }
-.event-time[data-v-520aee85] {
+.event-time[data-v-1e2b483b] {
   width: 100px;
   flex-shrink: 0;
   padding: 0.5rem;
@@ -356,145 +378,135 @@ display: block;
   align-items: center;
   font-size: 0.9rem;
 }
-.event-details[data-v-520aee85] {
+.event-details[data-v-1e2b483b] {
   flex-grow: 1;
   padding: 0.5rem;
   border-left: 1px solid rgba(255, 255, 255, 0.2);
 }
-.event-title[data-v-520aee85] {
+.event-title[data-v-1e2b483b] {
   font-size: 1rem;
   margin-bottom: 0.25rem;
 }
-.event-day[data-v-520aee85] {
+.event-day[data-v-1e2b483b] {
   font-size: 0.8rem;
   opacity: 0.8;
 }
-.event-day.today[data-v-520aee85] {
+.event-day.today[data-v-1e2b483b] {
   color: var(--bgl-primary);
   opacity: 1;
 }
 @media (max-width: 768px) {
-.agenda-header[data-v-520aee85] {
+.agenda-header[data-v-1e2b483b] {
     padding: 0.5rem;
 }
-.time-column[data-v-520aee85] {
+.time-column[data-v-1e2b483b] {
     width: 80px;
 }
-.event-content[data-v-520aee85] {
+.event-content[data-v-1e2b483b] {
     font-size: 0.9rem;
 }
-.event-time[data-v-520aee85] {
+.event-time[data-v-1e2b483b] {
     width: 80px;
     font-size: 0.8rem;
 }
-.event-title[data-v-520aee85] {
+.event-title[data-v-1e2b483b] {
     font-size: 0.9rem;
 }
-.event-day[data-v-520aee85] {
+.event-day[data-v-1e2b483b] {
     font-size: 0.7rem;
 }
 }
 
-.dayGrid[data-v-bc647d79]{
+.dayGrid[data-v-8b1a770f] {
 	display: grid;
 	grid-template-columns: 5rem 1fr;
 }
-.time-column[data-v-bc647d79] {
-  width: 80px;
-  flex-shrink: 0;
+.time-column[data-v-8b1a770f] {
+	width: 80px;
+	flex-shrink: 0;
 }
-.events-column[data-v-bc647d79] {
-  flex-grow: 1;
-  position: relative;
-  border-inline-start: 1px solid var(--border-color);
+.events-column[data-v-8b1a770f] {
+	flex-grow: 1;
+	position: relative;
+	border-inline-start: 1px solid var(--border-color);
+	min-height: 100%; /* Ensure the column fills the full height */
 }
-.date-header[data-v-bc647d79] {
-  padding: 0.5rem;
-  text-align: center;
+.date-header[data-v-8b1a770f] {
+	padding: 0.5rem;
+	text-align: center;
 }
-.day-header .events-column[data-v-bc647d79] {
-  border-inline-start: 1px solid transparent;
+.day-header .events-column[data-v-8b1a770f] {
+	border-inline-start: 1px solid transparent;
 }
-.time-slot[data-v-bc647d79] {
-  height: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+.time-slot[data-v-8b1a770f] {
+	height: 60px; /* Match this with the slotHeight variable */
+	display: flex;
+	align-items: flex-start; /* Align to top to match events */
+	justify-content: center;
+	padding: 0.5rem 0;
+	box-sizing: border-box;
 }
-.time-slots[data-v-bc647d79] {
-  flex-grow: 1;
-  display: flex;
-  overflow: auto;
-  position: relative;
+.time-slots[data-v-8b1a770f] {
+	flex-grow: 1;
+	display: flex;
+	overflow: auto;
+	position: relative;
 }
-.event[data-v-bc647d79] {
-  left: 10px;
-  right: 10px;
+.event[data-v-8b1a770f] {
+	left: 10px;
+	right: 10px;
+	box-sizing: border-box;
 }
-.event[data-v-bc647d79]:hover {
-  z-index: 2;
-  transform: scale(1.02);
+.event[data-v-8b1a770f]:hover {
+	z-index: 2;
+	transform: scale(1.02);
 }
-.event-content[data-v-bc647d79] {
-  padding: 0.5rem;
-  color: white;
-  font-size: 0.9rem;
-  height: 100%;
-  overflow: hidden;
+.event-content[data-v-8b1a770f] {
+	padding: 0.5rem;
+	color: white;
+	font-size: 0.9rem;
+	height: 100%;
+	overflow: hidden;
 }
-.event-title[data-v-bc647d79] {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+.event-title[data-v-8b1a770f] {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
 }
-.event-time[data-v-bc647d79] {
-  font-size: 0.8rem;
+.event-time[data-v-8b1a770f] {
+	font-size: 0.8rem;
 }
-.drag-preview[data-v-bc647d79] {
+.drag-preview[data-v-8b1a770f] {
+	border: 1px solid var(--bgl-primary);
 	background-color: rgba(var(--bgl-primary-rgb), 0.1);
+	box-sizing: border-box;
 }
-.current-time-line[data-v-bc647d79] {
-  height: 2px;
-}
-.custom-popover[data-v-bc647d79] {
-  position: fixed;
-  z-index: 1000;
-  min-width: 250px;
-  max-width: 350px;
-  background-color: white;
-  border-radius: 4px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-  animation: fadeIn-bc647d79 0.2s ease;
-  transform-origin: center left;
-}
-@keyframes fadeIn-bc647d79 {
-from {
-    opacity: 0;
-    transform: scale(0.95);
-}
-to {
-    opacity: 1;
-    transform: scale(1);
+.current-time-line[data-v-8b1a770f] {
+	height: 2px;
+	background-color: var(--bgl-primary);
 }
+.current-time-dot[data-v-8b1a770f] {
+	background-color: var(--bgl-primary);
+	margin-right: -5px; /* Adjust dot position */
 }
 
-.month-view[data-v-eeb8abde] {
+.month-view[data-v-0b1117c4] {
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow: hidden;
 }
-.month-header[data-v-eeb8abde] {
+.month-header[data-v-0b1117c4] {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   border-bottom: 1px solid var(--border-color);
 }
-.weekday[data-v-eeb8abde] {
+.weekday[data-v-0b1117c4] {
   padding: 0.5rem;
   text-align: center;
   color: var(--text-muted);
 }
-.month-grid[data-v-eeb8abde] {
+.month-grid[data-v-0b1117c4] {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   grid-template-rows: repeat(6, 1fr);
@@ -502,7 +514,7 @@ to {
   overflow: auto;
   border-inline-end: 1px solid var(--border-color);
 }
-.day-cell[data-v-eeb8abde] {
+.day-cell[data-v-0b1117c4] {
   border-inline-start: 1px solid var(--border-color);
   border-bottom: 1px solid var(--border-color);
   padding: 0.5rem;
@@ -510,24 +522,24 @@ to {
   display: flex;
   flex-direction: column;
 }
-.day-number[data-v-eeb8abde] {
+.day-number[data-v-0b1117c4] {
   margin-bottom: 0.5rem;
 }
-.other-month[data-v-eeb8abde] {
+.other-month[data-v-0b1117c4] {
   background-color: var(--bgl-gray-light);
   color: var(--bgl-gray);
 }
-.today[data-v-eeb8abde] {
+.today[data-v-0b1117c4] {
   background-color: var(--bgl-primary-light);
 }
-.today .day-number[data-v-eeb8abde] {
+.today .day-number[data-v-0b1117c4] {
   color: var(--bgl-primary);
 }
-.day-events[data-v-eeb8abde] {
+.day-events[data-v-0b1117c4] {
   flex-grow: 1;
   overflow-y: auto;
 }
-.event-item[data-v-eeb8abde] {
+.event-item[data-v-0b1117c4] {
   margin-bottom: 0.25rem;
   padding: 0.25rem;
   border-radius: 4px;
@@ -536,24 +548,24 @@ to {
   cursor: pointer;
   transition: all 0.2s ease;
 }
-.event-title[data-v-eeb8abde] {
+.event-title[data-v-0b1117c4] {
   font-weight: 500;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-.event-time[data-v-eeb8abde] {
+.event-time[data-v-0b1117c4] {
   font-size: 0.7rem;
   opacity: 0.8;
 }
-.event-dot[data-v-eeb8abde] {
+.event-dot[data-v-0b1117c4] {
   width: 6px;
   height: 6px;
   background-color: var(--bgl-primary);
   border-radius: 50%;
   margin: 0.25rem auto;
 }
-.custom-popover[data-v-eeb8abde] {
+.custom-popover[data-v-0b1117c4] {
   position: fixed;
   z-index: 1000;
   min-width: 250px;
@@ -561,10 +573,10 @@ to {
   background-color: white;
   border-radius: var(--btn-border-radius);
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-  animation: fadeIn-eeb8abde 0.2s ease;
+  animation: fadeIn-0b1117c4 0.2s ease;
   transform-origin: center left;
 }
-@keyframes fadeIn-eeb8abde {
+@keyframes fadeIn-0b1117c4 {
 from {
     opacity: 0;
     transform: scale(0.95);
@@ -575,76 +587,78 @@ to {
 }
 }
 @media (max-width: 768px) {
-.day-cell[data-v-eeb8abde] {
+.day-cell[data-v-0b1117c4] {
     min-height: 60px;
     padding: 0.25rem;
 }
-.day-number[data-v-eeb8abde] {
+.day-number[data-v-0b1117c4] {
     font-size: 0.8rem;
     margin-bottom: 0.25rem;
 }
-.weekday[data-v-eeb8abde] {
+.weekday[data-v-0b1117c4] {
     font-size: 0.8rem;
     padding: 0.25rem;
 }
 }
 
-.weekGrid[data-v-b897fbe8]{
+.weekGrid[data-v-1cd041ac] {
 	display: grid;
 	grid-template-columns: 5rem repeat(7, 1fr);
 }
-.days-column[data-v-b897fbe8] {
-  flex-grow: 1;
-  display: flex;
-}
-.time-slot[data-v-b897fbe8] {
-  height: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--text-muted);
-}
-.time-slots[data-v-b897fbe8] {
-  flex-grow: 1;
-  display: flex;
-  overflow: auto;
-  position: relative;
-}
-.day-column[data-v-b897fbe8] {
-  flex: 1;
+.days-column[data-v-1cd041ac] {
+	flex-grow: 1;
+	display: flex;
 }
-.event[data-v-b897fbe8] {
-  margin-right: 2px;
+.day-column[data-v-1cd041ac] {
+	flex: 1;
+	position: relative; /* Ensure absolute positioning works properly */
+	min-height: 100%; /* Ensure column fills the full height */
 }
-.event[data-v-b897fbe8]:hover {
-  z-index: 1;
+
+/* Add consistent styling for the time slots */
+.txt-light[data-v-1cd041ac] {
+	padding: 0.5rem 0;
+	box-sizing: border-box;
+	display: flex;
+	align-items: flex-start;
+	justify-content: center;
 }
-.drag-preview[data-v-b897fbe8] {
-  border: 2px solid var(--bgl-primary);
+.event[data-v-1cd041ac] {
+	margin-right: 2px;
+	box-sizing: border-box;
 }
-.current-time-line[data-v-b897fbe8] {
-  height: 2px;
+.event[data-v-1cd041ac]:hover {
+	z-index: 2;
 }
-.custom-popover[data-v-b897fbe8] {
-  min-width: 250px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-  animation: fadeIn-b897fbe8 0.2s ease;
-  transform-origin: center left;
+.drag-preview[data-v-1cd041ac] {
+	border: 1px solid var(--bgl-primary);
+	background-color: rgba(var(--bgl-primary-rgb), 0.1);
+	box-sizing: border-box; /* Ensure consistent sizing */
 }
-@keyframes fadeIn-b897fbe8 {
-from {
-    opacity: 0;
-    transform: scale(0.95);
+.current-time-line[data-v-1cd041ac] {
+	height: 2px;
+	background-color: var(--bgl-primary);
 }
-to {
-    opacity: 1;
-    transform: scale(1);
+.current-time-dot[data-v-1cd041ac] {
+	background-color: var(--bgl-primary);
+	margin-right: -5px; /* Adjust dot position */
 }
+
+/* This ensures all grid content aligns properly */
+.overflow[data-v-1cd041ac] {
+	position: relative;
 }
-@media screen and (max-width: 910px) {
+
+/* Time column headers should be aligned with their content */
+.day-header[data-v-1cd041ac] {
+	box-sizing: border-box;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
 }
 
-.calendar[data-v-36ea5622] {
+.calendar[data-v-840b6594] {
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -1396,69 +1410,76 @@ pre code.hljs{
 	outline-color: var(--input-bg);
 }
 
-.calendar-container[data-v-9c8816c6] {
+.calendar-container[data-v-17319f4d] {
 	max-width: 90vw;
 }
-.calendar-section[data-v-9c8816c6] {
+.calendar-section[data-v-17319f4d] {
 	min-width: 280px;
 }
-.calendar-grid[data-v-9c8816c6] {
+.calendar-grid[data-v-17319f4d] {
 	grid-template-columns: repeat(7, 1fr);
 }
-.month-grid[data-v-9c8816c6] {
+.month-grid[data-v-17319f4d] {
 	grid-template-columns: repeat(3, 1fr);
 	grid-template-rows: repeat(4, 1fr);
 }
-.year-grid[data-v-9c8816c6] {
+.year-grid[data-v-17319f4d] {
 	grid-template-columns: repeat(3, 1fr);
 	grid-template-rows: repeat(7, 1fr);
 }
-.month-item[data-v-9c8816c6],
-.year-item[data-v-9c8816c6] {
+.month-item[data-v-17319f4d],
+.year-item[data-v-17319f4d] {
 	background: none;
 	color: var(--bgl-text-color);
 }
-.month-item[data-v-9c8816c6]:hover:not(.disabled),
-.year-item[data-v-9c8816c6]:hover:not(.disabled) {
+.month-item[data-v-17319f4d]:hover:not(.disabled),
+.year-item[data-v-17319f4d]:hover:not(.disabled) {
 	background: var(--bgl-box-bg);
 	filter: var(--bgl-hover-filter);
 }
-.month-item[data-v-9c8816c6]:active:not(.disabled),
-.year-item[data-v-9c8816c6]:active:not(.disabled) {
+.month-item[data-v-17319f4d]:active:not(.disabled),
+.year-item[data-v-17319f4d]:active:not(.disabled) {
 	background: var(--bgl-box-bg);
 	filter: var(--bgl-active-filter);
 }
-.month-item.selected[data-v-9c8816c6],
-.year-item.selected[data-v-9c8816c6] {
+.month-item.selected[data-v-17319f4d],
+.year-item.selected[data-v-17319f4d] {
 	background-color: var(--bgl-primary);
 	color: white;
 }
-.month-item.disabled[data-v-9c8816c6],
-.year-item.disabled[data-v-9c8816c6] {
+.month-item.disabled[data-v-17319f4d],
+.year-item.disabled[data-v-17319f4d] {
 	opacity: 0.6;
 	filter: grayscale(0.3);
 }
-.day[data-v-9c8816c6] {
+.day[data-v-17319f4d] {
 	border: none;
 	background: none;
 	color: var(--bgl-text-color);
 }
-.day[data-v-9c8816c6]:hover:not(.disabled) {
+.day[data-v-17319f4d]:hover:not(.disabled) {
 	background-color: var(--input-bg);
+	color: var(--bgl-text-color);
+	outline: 1px solid var(--border-color);
 }
-.day.selected[data-v-9c8816c6] {
+.day:hover:not(.disabled).selected[data-v-17319f4d] {
+	filter: var(--bgl-hover-filter);
 	background-color: var(--bgl-primary);
 	color: var(--bgl-white);
 }
-.day.today[data-v-9c8816c6]:not(.selected) {
+.day.selected[data-v-17319f4d] {
+	background-color: var(--bgl-primary);
+	color: var(--bgl-white);
+}
+.day.today[data-v-17319f4d]:not(.selected) {
 	border: 1px solid var(--bgl-primary);
 }
-.day.disabled[data-v-9c8816c6] {
+.day.disabled[data-v-17319f4d] {
 	opacity: 0.6;
 	filter: grayscale(0.3);
 	cursor: not-allowed;
 }
-.day.not-in-month[data-v-9c8816c6] {
+.day.not-in-month[data-v-17319f4d] {
 	opacity: 0.4;
 }
 
@@ -1470,9 +1491,11 @@ pre code.hljs{
 	--input-font-size: 12px;
 	opacity: 0.6;
 	--input-height: 20px;
+	width: 75px;
 }
-.date-picker-container .date-input .bagel-input input{
+.date-picker-container .txtInputIconStart input{
 	padding: 0 !important;
+	padding-inline-start: 1.25rem !important;
 }
 
 .fileUploadWrap[data-v-50fd0597] {
@@ -5034,6 +5057,14 @@ to {
 .hmin100p,
 .h-min100p {
     min-height: 100%;
+}.vh-min-100,
+.min100vh,
+.min-100vh,
+.h-min100vh {
+    min-height: 100vh !important;
+}.h-min-unset,
+.min-h-unset {
+    min-height: 100%;
 }.min-0,
 .min0,
 .wmin0p,
@@ -8793,6 +8824,18 @@ to {
         min-height: 100%;
     }
 
+    .m_h-min-unset,
+    .m_min-h-unset {
+        min-height: 100%;
+    }
+
+    .m_vh-min-100,
+    .m_min100vh,
+    .m_min-100vh,
+    .m_h-min100vh {
+        min-height: 100vh !important;
+    }
+
     .m_min-0,
     .m_min0,
     .m_wmin0p,

package/dist/types/BagelForm.d.ts

@@ -1,4 +1,7 @@
 import { SelectInput, TextInput } from '..';
+import { Paths, Get, IterableElement } from 'type-fest';
+import { ToString } from 'type-fest/source/internal';
+import { LiteralStringUnion } from 'type-fest/source/literal-union';
 import { VNode } from 'vue';
 import { ComponentExposed } from 'vue-component-type-helpers';
 export type AttributeValue = string | number | boolean | undefined | undefined | {
@@ -14,18 +17,18 @@ export type BagelFieldOptions<T> = (string | ({
 } | string | number | boolean | {
     [key: string]: any;
 })[] | ((val: any, rowData?: T) => void));
-export type GenericAssertFn<T> = (val: any, row?: T) => boolean;
-export type TypedAssertFn<T, K> = (K extends keyof T ? (val?: FieldVal<T, K>, row?: T) => boolean : GenericAssertFn<T>);
-export type VIfType<T, P> = string | boolean | ((val?: FieldVal<T, P>, rowData?: T) => boolean);
-export type ValidationFn<T, K> = (val: FieldVal<T, K>, rowData?: T) => string | undefined;
-export type NonArrayMethodKeys<T> = Exclude<keyof T, keyof any[] | symbol>;
-export type Path<T> = {
-    [K in NonArrayMethodKeys<T> & (string | number)]: T[K] extends object ? (`${K}` | (Path<T[K]> extends infer Rest ? Rest extends string | number ? `${K}.${Rest}` : never : never)) : `${K}`;
-}[NonArrayMethodKeys<T> & (string | number)];
-export type FieldVal<T, P> = P extends `${infer Key}.${infer Rest}` ? Key extends keyof T ? FieldVal<T[Key], Rest> : never : P extends keyof T ? T[P] : never;
-export type ArrayFieldVal<T, P, FV = FieldVal<T, P>> = (FV extends Array<infer U> ? U : FV extends object ? FV : never);
+export type VIfType<T, P extends Path<T>> = (string | boolean | ((val?: FieldVal<T, P>, rowData?: T) => boolean));
+export type ValidationFn<T, P extends Path<T>> = (val: FieldVal<T, P>, rowData?: T) => string | undefined;
+export type _Path<T> = (ToString<Paths<T, {
+    bracketNotation: false;
+}>>);
+export type Path<T> = (FieldVal<T, _Path<T>> extends Array<any> ? LiteralStringUnion<_Path<T>> : _Path<T>);
+/** The value type at path P in object T. */
+export type FieldVal<T, P extends Path<T>> = Get<T, P>;
+/** If path P in T is an array, this gives the array's element type. */
+export type ArrayFieldVal<T, P extends Path<T>> = IterableElement<Get<T, P>>;
 export type SchemaChildrenT<T> = (Field<T> | string | VNode)[];
-export interface BaseBagelField<T, P> {
+export interface BaseBagelField<T, P extends Path<T>> {
     '$el'?: any;
     'id'?: P;
     'label'?: string;