@bagelink/vue 0.0.1004 → 0.0.1008

package/dist/index.mjs

@@ -3,6 +3,42 @@ var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, {
 var __publicField2 = (obj, key, value) => __defNormalProp2(obj, typeof key !== "symbol" ? key + "" : key, value);
 import { defineComponent, reactive, provide, openBlock, createElementBlock, renderSlot, ref, computed, inject, watch, normalizeClass, createElementVNode, unref, createVNode, createCommentVNode, toDisplayString, Transition, withCtx, isRef, Fragment, renderList, createBlock, useSlots, resolveDirective, withDirectives, resolveDynamicComponent, mergeProps, withModifiers, withKeys, createTextVNode, normalizeStyle, onMounted, onUnmounted, resolveComponent, mergeModels, useModel, pushScopeId, popScopeId, nextTick, normalizeProps, guardReactiveProps, withScopeId, createApp, h as h$2, onBeforeUnmount, vModelCheckbox, vModelText, toRef, createSlots, Teleport, render as render$e, onBeforeUpdate, vShow, getCurrentScope, onScopeDispose, vModelRadio, TransitionGroup, vModelDynamic, useCssVars, getCurrentInstance, shallowRef, markRaw } from "vue";
 import { RouterLink } from "vue-router";
+const bagelFormUtils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  get bglForm() {
+    return bglForm;
+  },
+  get checkField() {
+    return checkField;
+  },
+  get dateField() {
+    return dateField;
+  },
+  get findBglFieldById() {
+    return findBglFieldById;
+  },
+  get frmRow() {
+    return frmRow;
+  },
+  get getBaseField() {
+    return getBaseField;
+  },
+  get numField() {
+    return numField;
+  },
+  get richText() {
+    return richText;
+  },
+  get slctField() {
+    return slctField;
+  },
+  get telField() {
+    return telField;
+  },
+  get txtField() {
+    return txtField;
+  }
+}, Symbol.toStringTag, { value: "Module" }));
 const _sfc_main$11 = /* @__PURE__ */ defineComponent({
   __name: "Accordion",
   setup(__props) {
@@ -19,7 +55,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$P = ["aria-expanded", "aria-controls"];
 const _hoisted_2$v = { class: "accordion-label" };
-const _hoisted_3$o = ["id", "aria-hidden"];
+const _hoisted_3$p = ["id", "aria-hidden"];
 const _sfc_main$10 = /* @__PURE__ */ defineComponent({
   __name: "AccordionItem",
   props: {
@@ -104,7 +140,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
               "aria-hidden": unref(isOpen) ? "false" : "true"
             }, [
               renderSlot(_ctx.$slots, "default", {}, void 0, true)
-            ], 8, _hoisted_3$o)) : createCommentVNode("", true)
+            ], 8, _hoisted_3$p)) : createCommentVNode("", true)
           ]),
           _: 3
         })
@@ -269,7 +305,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$_, [["__scopeId", "data-v-3c0720f5"]]);
+const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$_, [["__scopeId", "data-v-521354bb"]]);
 const _hoisted_1$M = ["dismissable"];
 const _hoisted_2$u = { class: "m-0" };
 const _sfc_main$Z = /* @__PURE__ */ defineComponent({
@@ -372,7 +408,8 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
 });
 const Badge = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-2f3caf93"]]);
 const _hoisted_1$K = ["src"];
-const _hoisted_2$t = ["src", "autoplay", "muted", "loop", "controls"];
+const _hoisted_2$t = ["autoplay", "muted", "loop", "controls", "playsinline"];
+const _hoisted_3$o = ["src", "type"];
 const _sfc_main$W = /* @__PURE__ */ defineComponent({
   __name: "BglVideo",
   props: {
@@ -381,16 +418,36 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
     mute: { type: Boolean },
     aspectRatio: {},
     controls: { type: Boolean },
-    loop: { type: Boolean }
+    loop: { type: Boolean },
+    status: {},
+    playsinline: { type: Boolean }
   },
-  setup(__props) {
+  setup(__props, { expose: __expose }) {
     const props2 = __props;
+    const videoFormat = computed(() => {
+      var _a2, _b, _c;
+      return ((_c = (_b = (_a2 = props2.src) == null ? void 0 : _a2.split(".").pop()) == null ? void 0 : _b.split("?").shift()) == null ? void 0 : _c.toLowerCase()) || "mp4";
+    });
     const aspectRatio = computed(
       () => {
         var _a2;
         return ((_a2 = props2.aspectRatio) == null ? void 0 : _a2.replace(":", "/")) || "16/9";
       }
     );
+    const video = ref();
+    function play() {
+      var _a2;
+      (_a2 = video.value) == null ? void 0 : _a2.play();
+    }
+    function pause() {
+      var _a2;
+      (_a2 = video.value) == null ? void 0 : _a2.pause();
+    }
+    watch(() => props2.status, (status) => {
+      if (status === "play") play();
+      if (status === "pause") pause();
+    });
+    __expose({ play, pause });
     const embedType = computed(() => {
       const youtubeRegex2 = /youtube\.com|youtu\.be/;
       if (youtubeRegex2.test(props2.src || "")) return "YouTube";
@@ -432,19 +489,25 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
           allow: "autoplay"
         }, null, 12, _hoisted_1$K)) : _ctx.src ? (openBlock(), createElementBlock("video", {
           key: 1,
-          src: _ctx.src,
+          ref_key: "video",
+          ref: video,
           autoplay: _ctx.autoplay,
           muted: _ctx.mute,
           loop: _ctx.loop,
           style: normalizeStyle({ aspectRatio: aspectRatio.value }),
           controls: _ctx.controls,
-          playsinline: ""
-        }, null, 12, _hoisted_2$t)) : createCommentVNode("", true)
+          playsinline: _ctx.playsinline
+        }, [
+          createElementVNode("source", {
+            src: _ctx.src,
+            type: `video/${videoFormat.value}`
+          }, null, 8, _hoisted_3$o)
+        ], 12, _hoisted_2$t)) : createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const BglVideo = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["__scopeId", "data-v-732c510b"]]);
+const BglVideo = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["__scopeId", "data-v-006552f6"]]);
 const _hoisted_1$J = {
   key: 0,
   class: "card_label"
@@ -7488,9 +7551,10 @@ async function convertValueToCoords(state2, options) {
     crossAxis: 0,
     alignmentAxis: null
   } : {
-    mainAxis: rawValue.mainAxis || 0,
-    crossAxis: rawValue.crossAxis || 0,
-    alignmentAxis: rawValue.alignmentAxis
+    mainAxis: 0,
+    crossAxis: 0,
+    alignmentAxis: null,
+    ...rawValue
   };
   if (alignment && typeof alignmentAxis === "number") {
     crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
@@ -7595,11 +7659,7 @@ const shift = function(options) {
         ...limitedCoords,
         data: {
           x: limitedCoords.x - x2,
-          y: limitedCoords.y - y2,
-          enabled: {
-            [mainAxis]: checkMainAxis,
-            [crossAxis]: checkCrossAxis
-          }
+          y: limitedCoords.y - y2
         }
       };
     }
@@ -7613,7 +7673,6 @@ const size = function(options) {
     name: "size",
     options,
     async fn(state2) {
-      var _state$middlewareData, _state$middlewareData2;
       const {
         placement,
         rects,
@@ -7649,11 +7708,10 @@ const size = function(options) {
       const noShift = !state2.middlewareData.shift;
       let availableHeight = overflowAvailableHeight;
       let availableWidth = overflowAvailableWidth;
-      if ((_state$middlewareData = state2.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
-        availableWidth = maximumClippingWidth;
-      }
-      if ((_state$middlewareData2 = state2.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
-        availableHeight = maximumClippingHeight;
+      if (isYAxis) {
+        availableWidth = alignment || noShift ? min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
+      } else {
+        availableHeight = alignment || noShift ? min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
       }
       if (noShift && !alignment) {
         const xMin = max(overflow.left, 0);
@@ -9571,7 +9629,9 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
       if (activeTab && tabsWrap.value) {
         const { offsetLeft, offsetWidth } = activeTab;
         tabsWrap.value.style.setProperty("--indicator-left", `${offsetLeft}px`);
-        tabsWrap.value.style.setProperty("--indicator-width", `${offsetWidth}px`);
+        if (tabsWrap.value) {
+          tabsWrap.value.style.setProperty("--indicator-width", `${offsetWidth}px`);
+        }
       }
     }
     function selectTab(tab) {
@@ -9612,7 +9672,7 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         ref_key: "tabsWrap",
         ref: tabsWrap,
-        class: normalizeClass(["grid auto-flow-columns relative fit-content bgl_tabs_wrap", { "bgl_flat-tabs": _ctx.flat, "bgl_vertical-tabs": _ctx.vertical }])
+        class: normalizeClass(["grid auto-flow-columns relative fit-content bgl_tabs_wrap overflow-hidden", { "bgl_flat-tabs": _ctx.flat, "bgl_vertical-tabs": _ctx.vertical }])
       }, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(props2.tabs, (tab, i2) => {
           return openBlock(), createElementBlock("button", {
@@ -9632,7 +9692,7 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const TabsNav = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["__scopeId", "data-v-90649f98"]]);
+const TabsNav = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["__scopeId", "data-v-dbce6d28"]]);
 const _sfc_main$O = /* @__PURE__ */ defineComponent({
   __name: "BglField",
   props: {
@@ -9680,6 +9740,7 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
       return data2;
     }
     function getFieldData(obj, key) {
+      if (typeof obj !== "object" || obj === null) return obj;
       const keys4 = key.split(objPathRegex);
       let result2 = obj;
       for (const k2 of keys4) {
@@ -18988,10 +19049,10 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
           }
         }
         try {
+          await appendScript("https://cdnjs.cloudflare.com/ajax/libs/heic2any/0.0.1/index.min.js");
           const response = await fetch(src);
           const blob = await response.blob();
-          const { default: heic2any } = await import("./heic2any-BrqcNzfV.js").then((n2) => n2.h);
-          const convertedBlob = await heic2any({ blob });
+          const convertedBlob = await window.heic2any({ blob });
           imageSrc.value = URL.createObjectURL(convertedBlob);
           if ("caches" in window) {
             try {
@@ -19026,7 +19087,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Image$1 = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-3f8cf457"]]);
+const Image$1 = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-a96b25a8"]]);
 const _hoisted_1$w = { class: "bagel-input" };
 const _hoisted_2$k = {
   key: 0,
@@ -20362,6 +20423,7 @@ function formatting(state2) {
   };
   return { text, block, list, clear };
 }
+const { frmRow: frmRow$1, numField: numField$1 } = bagelFormUtils;
 function insertImage(modal, state2) {
   const { range: range2, doc } = state2;
   if (!range2 || !doc) return;
@@ -20369,15 +20431,31 @@ function insertImage(modal, state2) {
     title: "Upload Image",
     schema: [
       { id: "src", $el: "file", attrs: { bindkey: "url" } },
-      { id: "alt", $el: "text", label: "Alt Text" }
+      { id: "alt", $el: "text", label: "Alt Text" },
+      frmRow$1(
+        numField$1("width", "Width", { min: 1 }),
+        numField$1("height", "Height", { min: 1 })
+      ),
+      { id: "figcaption", $el: "check", label: "Show Caption" }
     ],
     onSubmit: (data2) => {
       if (data2.src) {
         const img = doc.createElement("img");
-        img.src = data2.src;
-        img.alt = data2.alt;
+        Object.assign(img, {
+          src: data2.src,
+          alt: data2.alt || "",
+          width: data2.width || void 0,
+          height: data2.height || void 0
+        });
+        const node = data2.figcaption ? (() => {
+          const figcaption = doc.createElement("figcaption");
+          figcaption.textContent = data2.alt;
+          const figure = doc.createElement("figure");
+          figure.append(img, figcaption);
+          return figure;
+        })() : img;
         range2.collapse(false);
-        range2.insertNode(img);
+        range2.insertNode(node);
       }
     }
   });
@@ -20812,7 +20890,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
   __name: "SelectInput",
   props: {
     options: {},
-    placeholder: {},
+    placeholder: { default: "Select" },
     disabled: { type: Boolean },
     modelValue: {},
     searchable: { type: Boolean },
@@ -20824,14 +20902,14 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     hideLabel: { type: Boolean },
     defaultValue: {},
     clearable: { type: Boolean },
-    searchPlaceholder: {},
-    onSearch: { type: Function }
+    searchPlaceholder: { default: "Search" },
+    onSearch: {}
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
     const props2 = __props;
     const emit2 = __emit;
-    const searchPlaceholder = computed(() => props2.searchPlaceholder || "Search");
+    const searchPlaceholder = computed(() => props2.searchPlaceholder);
     const searchInput = ref();
     let selectedItems = ref([]);
     const selectedItemCount = computed(() => selectedItems.value.length ?? 0);
@@ -20840,7 +20918,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     let selected = ref(false);
     let open = ref(false);
     const selectedLabel = computed(() => {
-      if (selectedItemCount.value === 0) return props2.placeholder || "Select";
+      if (selectedItemCount.value === 0) return props2.placeholder;
       if (selectedItemCount.value > 4) {
         const str = selectedItems.value.slice(0, 4).map((item) => getLabel(item)).join(", ");
         return `${str}... +${selectedItemCount.value - 4}`;
@@ -21112,7 +21190,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["__scopeId", "data-v-982f5078"]]);
+const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["__scopeId", "data-v-9574c8a2"]]);
 /*!
  * Signature Pad v5.0.4 | https://github.com/szimek/signature_pad
  * (c) 2024 Szymon Nowak | Released under the MIT license
@@ -29669,10 +29747,10 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     const emit2 = __emit;
     const slots = useSlots();
     let isOpen = ref(props2.open);
-    function toggleMenu() {
+    const toggleMenu = useDebounceFn(() => {
       isOpen.value = !isOpen.value;
       emit2("update:open", isOpen.value);
-    }
+    });
     return (_ctx, _cache) => {
       const _directive_tooltip = resolveDirective("tooltip");
       return openBlock(), createElementBlock("div", {
@@ -29683,8 +29761,8 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
           color: "white",
           class: "mb-05 absolute toggleNav z-2 border",
           icon: "keyboard_arrow_right",
-          onClick: toggleMenu
-        }),
+          onClick: unref(toggleMenu)
+        }, null, 8, ["onClick"]),
         createVNode(unref(_sfc_main$V), { class: "py-1 px-05 h-100 flex column gap-05 rounded relative bg-primary font-light overflow-y" }, {
           default: withCtx(() => [
             !unref(isOpen) || !unref(slots)["brand-open"] ? renderSlot(_ctx.$slots, "brand", { key: 0 }, void 0, true) : createCommentVNode("", true),
@@ -29714,8 +29792,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
                   _directive_tooltip,
                   {
                     content: nav.label,
-                    disabled: _ctx.open,
-                    class: ["nav-tooltip"]
+                    disabled: _ctx.open
                   },
                   void 0,
                   { right: true }
@@ -29731,7 +29808,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SidebarMenu = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-51cedd11"]]);
+const SidebarMenu = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-ac02125e"]]);
 const _sfc_main$k = /* @__PURE__ */ defineComponent({
   __name: "Skeleton",
   props: {
@@ -30225,8 +30302,8 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
                   style: normalizeStyle({ float: _ctx.side ? "left" : "right" }),
                   flat: "",
                   icon: "close",
-                  onClick: closeModal,
-                  thin: ""
+                  thin: "",
+                  onClick: closeModal
                 }, null, 8, ["style"]),
                 _ctx.title ? (openBlock(), createBlock(unref(_sfc_main$3), {
                   key: 0,
@@ -30323,7 +30400,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     width: {},
     dismissable: { type: Boolean },
     actions: {},
-    schema: { type: Function },
+    schema: {},
     onSubmit: { type: Function },
     onDelete: { type: Function },
     visible: { type: Boolean },
@@ -30430,7 +30507,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ModalForm = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-6846fbe3"]]);
+const ModalForm = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-3342a563"]]);
 const _hoisted_1$5 = { class: "full-nav" };
 const _hoisted_2$4 = { class: "nav-scroll" };
 const _hoisted_3$3 = { class: "nav-links-wrapper" };
@@ -30588,8 +30665,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     useCssVars((_ctx) => ({
-      "5217b464": computedBackgroundColor.value,
-      "0b2b363f": cumputedTextColor.value
+      "33699ebd": computedBackgroundColor.value,
+      "bd23d150": cumputedTextColor.value
     }));
     const props2 = __props;
     const slots = useSlots();
@@ -30651,6 +30728,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
             _ctx.btn ? (openBlock(), createElementBlock("div", _hoisted_5$2, [
               createVNode(unref(Btn), mergeProps({
                 class: "bgl_pill-btn",
+                round: "",
                 thin: ""
               }, _ctx.btn), null, 16)
             ])) : createCommentVNode("", true)
@@ -30671,6 +30749,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
             _ctx.btnEnd ? (openBlock(), createElementBlock("div", _hoisted_8$2, [
               createVNode(unref(Btn), mergeProps({
                 class: "bgl_pill-btn",
+                round: "",
                 thin: ""
               }, _ctx.btnEnd), null, 16)
             ])) : createCommentVNode("", true)
@@ -30680,7 +30759,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Pill = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-5476be6c"]]);
+const Pill = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-4249cc3e"]]);
 const _sfc_main$5 = {};
 function _sfc_render$1(_ctx, _cache) {
   const _component_router_view = resolveComponent("router-view");
@@ -31301,25 +31380,26 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   emits: /* @__PURE__ */ mergeModels(["update:selectedItems", "orderBy", "select", "lastItemVisible"], ["update:loading", "update:itemHeight", "update:selectedItems"]),
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "c3b285e8": unref(computedItemHeight)
+      "0469f9a7": unref(computedItemHeight)
     }));
     const emit2 = __emit;
+    const NON_DIGIT_REGEX = /[^\d.-]/g;
     const slots = useSlots();
     const loading = useModel(__props, "loading");
     const itemHeight = useModel(__props, "itemHeight");
-    const computedItemHeight = computed(() => `${itemHeight.value}px`);
-    let sortField = ref("");
-    let sortDirection = ref("ASC");
     const selectedItems = useModel(
       __props,
       "selectedItems",
       {
-        set: (value) => {
-          setTimeout(updateAllSelectorState, 0);
-          return value;
-        }
+        set: (value) => value
       }
     );
+    let sortField = ref("");
+    let sortDirection = ref("ASC");
+    const allSelectorEl = ref();
+    const lastItemEl = ref();
+    const computedSelectedItems = computed(() => selectedItems.value);
+    const computedItemHeight = computed(() => `${itemHeight.value}px`);
     const isSelectable = computed(() => __props.selectable === true && Array.isArray(selectedItems.value));
     const computedSortField = computed(() => `_transformed_${sortField.value}`);
     const computedSchema = computed(() => useBglSchema({
@@ -31327,21 +31407,6 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       showFields: __props.showFields,
       data: __props.data
     }));
-    function transform(rowData) {
-      var _a2;
-      const obj = { ...rowData };
-      const schemaFields = computedSchema.value.filter((f2) => f2.id);
-      for (const field of schemaFields) {
-        const fieldData = rowData[`${field.id}`];
-        const newFieldVal = (_a2 = field.transform) == null ? void 0 : _a2.call(field, fieldData, rowData);
-        Object.assign(obj, {
-          [`${field.id}`]: fieldData,
-          [`_transformed_${field.id}`]: newFieldVal
-        });
-      }
-      return obj;
-    }
-    const NON_DIGIT_REGEX = /[^\d.-]/g;
     const computedData = computed(() => {
       if (!sortField.value || __props.useServerSort === true) return __props.data.map(transform);
       return __props.data.map(transform).sort(
@@ -31367,6 +31432,20 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         }
       );
     });
+    function transform(rowData) {
+      var _a2;
+      const obj = { ...rowData };
+      const schemaFields = computedSchema.value.filter((f2) => f2.id);
+      for (const field of schemaFields) {
+        const fieldData = rowData[`${field.id}`];
+        const newFieldVal = (_a2 = field.transform) == null ? void 0 : _a2.call(field, fieldData, rowData);
+        Object.assign(obj, {
+          [`${field.id}`]: fieldData,
+          [`_transformed_${field.id}`]: newFieldVal
+        });
+      }
+      return obj;
+    }
     function sort2(fieldname) {
       if (sortField.value === fieldname) {
         if (sortDirection.value === "ASC") sortDirection.value = "DESC";
@@ -31384,50 +31463,47 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         overscan: 10
       }
     );
-    watch(
-      () => computedData.value.length,
-      (newLength, oldLength) => {
-        if (newLength === oldLength || __props.onLastItemVisible !== void 0) return;
-        scrollTo(0);
-      }
-    );
-    const allSelector = ref();
-    const computedSelectedItems = computed(() => selectedItems.value);
     function updateAllSelectorState() {
-      if (!allSelector.value) return;
+      if (!allSelectorEl.value) return;
       const allSelected = computedData.value.length === computedSelectedItems.value.length && computedData.value.every((s2) => s2.id && computedSelectedItems.value.includes(s2.id));
-      allSelector.value.checked = allSelected;
-      allSelector.value.indeterminate = !allSelected && computedSelectedItems.value.length > 0;
+      allSelectorEl.value.checked = allSelected;
+      allSelectorEl.value.indeterminate = !allSelected && computedSelectedItems.value.length > 0;
     }
     function toggleSelectItem(item) {
       if (computedSelectedItems.value.length === 0) {
         const obj = { ...item };
-        Object.keys(obj).forEach((key) => {
-          if (key.startsWith("_transformed_")) delete obj[key];
-        });
+        Object.keys(obj).forEach((key) => key.startsWith("_transformed_") && delete obj[key]);
         emit2("select", obj);
         return;
       }
       const index2 = computedSelectedItems.value.indexOf(item.id);
-      if (index2 > -1) {
-        computedSelectedItems.value.splice(index2, 1);
-      } else {
-        computedSelectedItems.value.push(item.id);
-      }
+      index2 > -1 ? computedSelectedItems.value.splice(index2, 1) : computedSelectedItems.value.push(item.id);
     }
     function toggleSelectAll(event) {
       const value = event.target.checked;
       selectedItems.value = value ? computedData.value.map((d2) => d2.id) : [];
     }
-    const lastItem = ref();
     async function registerLastItemObserver() {
-      await until(() => lastItem.value).toBeTruthy();
-      useIntersectionObserver(lastItem.value, ([entry]) => {
+      await until(() => lastItemEl.value).toBeTruthy();
+      useIntersectionObserver(lastItemEl.value, ([entry]) => {
         if (entry.isIntersecting && computedData.value.length) {
           emit2("lastItemVisible");
         }
       });
     }
+    watch(
+      () => computedData.value.length,
+      (newLength, oldLength) => {
+        if (newLength === oldLength || __props.onLastItemVisible !== void 0) return;
+        scrollTo(0);
+      }
+    );
+    watch(
+      () => computedSelectedItems.value.length,
+      () => {
+        updateAllSelectorState();
+      }
+    );
     watch(
       () => loading.value,
       (newLoadingVal, oldLoadingVal) => {
@@ -31447,8 +31523,8 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
             createElementVNode("thead", _hoisted_3$1, [
               unref(isSelectable) ? (openBlock(), createElementBlock("th", _hoisted_4$1, [
                 createElementVNode("input", {
-                  ref_key: "allSelector",
-                  ref: allSelector,
+                  ref_key: "allSelectorEl",
+                  ref: allSelectorEl,
                   type: "checkbox",
                   onClick: _cache[0] || (_cache[0] = withModifiers(() => {
                   }, ["stop"])),
@@ -31519,8 +31595,9 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
               }), 128)),
               _ctx.onLastItemVisible !== void 0 ? (openBlock(), createElementBlock("tr", {
                 key: 0,
-                ref_key: "lastItem",
-                ref: lastItem
+                ref_key: "lastItemEl",
+                ref: lastItemEl,
+                style: { "height": "1px" }
               }, null, 512)) : createCommentVNode("", true)
             ])
           ])
@@ -31529,7 +31606,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-fae54756"]]);
+const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-4a5861ed"]]);
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "Title",
   props: {
@@ -32717,20 +32794,6 @@ function findBglFieldById(id, _schema) {
   }
   return void 0;
 }
-const BagelFormUtils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  bglForm,
-  checkField,
-  dateField,
-  findBglFieldById,
-  frmRow,
-  getBaseField,
-  numField,
-  richText,
-  slctField,
-  telField,
-  txtField
-}, Symbol.toStringTag, { value: "Module" }));
 const state = reactive({
   defaultLang: "",
   availableLangs: [],
@@ -33408,6 +33471,7 @@ const translations = {
     minute: "minute",
     second: "second",
     ago: "ago",
+    in: "in",
     justNow: "Just now"
   },
   es: {
@@ -33419,6 +33483,7 @@ const translations = {
     minute: "minuto",
     second: "segundo",
     ago: "hace",
+    in: "en",
     justNow: "Justo ahora"
   },
   fr: {
@@ -33430,6 +33495,7 @@ const translations = {
     minute: "minute",
     second: "seconde",
     ago: "il y a",
+    in: "dans",
     justNow: "À l’instant"
   },
   he: {
@@ -33441,6 +33507,7 @@ const translations = {
     minute: "דקה",
     second: "שנייה",
     ago: "לפני",
+    in: "בעוד",
     justNow: "זה עתה"
   }
 };
@@ -33450,7 +33517,7 @@ function timeAgo(date2, lang = "en") {
   const now = /* @__PURE__ */ new Date();
   const nowNumber = now.getTime();
   const dateNumber = date2.getTime();
-  const seconds = Math.floor((nowNumber - dateNumber) / 1e3);
+  const seconds = Math.floor((dateNumber - nowNumber) / 1e3);
   const intervals = [
     { label: "year", seconds: 31536e3 },
     { label: "month", seconds: 2592e3 },
@@ -33462,10 +33529,15 @@ function timeAgo(date2, lang = "en") {
   ];
   const selectedLang = translations[lang];
   for (const interval of intervals) {
-    const count2 = Math.floor(seconds / interval.seconds);
+    const count2 = Math.floor(Math.abs(seconds) / interval.seconds);
     if (count2 >= 1) {
-      const suffix = lang === "he" ? "" : ` ${selectedLang.ago}`;
-      const prefix = lang === "he" ? "לפני " : "";
+      const suffix = seconds < 0 ? ` ${selectedLang.ago}` : "";
+      const prefix = "";
+      if (interval.label === "day" && seconds > 0) {
+        const hours = Math.floor(Math.abs(seconds) % 86400 / 3600);
+        const hourLabel = hours > 1 ? `${selectedLang.hour}s` : selectedLang.hour;
+        return `${prefix}${count2} ${selectedLang[interval.label]}${hours > 0 ? ` ${hours} ${hourLabel}` : ""}${suffix}`;
+      }
       return `${prefix}${count2} ${selectedLang[interval.label]}${suffix}`;
     }
   }
@@ -33546,7 +33618,7 @@ export {
   allCountries,
   appendScript,
   appendStyle,
-  BagelFormUtils as bagelFormUtils,
+  bagelFormUtils,
   bagelInjectionKey,
   bindAttrs,
   classify,