@bagelink/vue 0.0.564 → 0.0.566

package/dist/index.mjs

@@ -1,7 +1,7 @@
 var __defProp2 = Object.defineProperty;
 var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField2 = (obj, key, value) => __defNormalProp2(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { pushScopeId, popScopeId, defineComponent, nextTick, openBlock, createBlock, createElementBlock, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, withScopeId, resolveComponent, normalizeStyle, withKeys, createElementVNode, Fragment as Fragment$1, createCommentVNode, mergeProps, withCtx, createVNode, ref, createApp, h as h$2, toDisplayString, reactive, computed, inject, unref, renderList, resolveDynamicComponent, useCssVars, useSlots, withModifiers, createTextVNode, watch, onMounted, onUnmounted, mergeModels, useModel, createSlots, Transition, provide, isRef, withDirectives, vModelCheckbox, toRef, Teleport, render as render$f, onBeforeUpdate, vShow, getCurrentScope, onScopeDispose, TransitionGroup, vModelDynamic, vModelText, vModelRadio, onBeforeUnmount, getCurrentInstance, watchEffect, markRaw, customRef, resolveDirective } from "vue";
+import { pushScopeId, popScopeId, defineComponent, nextTick, openBlock, createBlock, createElementBlock, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, withScopeId, resolveComponent, normalizeStyle, withKeys, createElementVNode, Fragment as Fragment$1, createCommentVNode, mergeProps, withCtx, createVNode, ref, createApp, h as h$2, toDisplayString, reactive, computed, inject, unref, renderList, resolveDynamicComponent, useCssVars, useSlots, withModifiers, createTextVNode, watch, onMounted, onUnmounted, mergeModels, useModel, createSlots, Transition, getCurrentScope, onScopeDispose, getCurrentInstance, shallowRef, withDirectives, isRef, vModelCheckbox, provide, toRef, Teleport, render as render$f, onBeforeUpdate, vShow, TransitionGroup, vModelDynamic, vModelText, vModelRadio, onBeforeUnmount, watchEffect, markRaw, customRef, resolveDirective } from "vue";
 const sides = ["top", "right", "bottom", "left"];
 const alignments = ["start", "end"];
 const placements$1 = /* @__PURE__ */ sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
@@ -5282,8 +5282,23 @@ function iffer(field, itemData) {
   if (typeof field["v-if"] === "function") return (_a2 = field["v-if"]) == null ? void 0 : _a2.call(field, itemData == null ? void 0 : itemData[field.id], itemData);
   return true;
 }
-const denullify = (itemData, fieldID) => fieldID && itemData ? itemData[fieldID] : null;
+function denullify(itemData, fieldID) {
+  if (!fieldID) return null;
+  return itemData ? itemData[fieldID] : null;
+}
 const isDate$1 = (dateToTest) => !Number.isNaN(Date.parse(dateToTest));
+function getFallbackSchema(data2, showFields) {
+  const keys4 = [
+    ...new Set((data2 ?? []).map(Object.keys).flat())
+  ];
+  const schema = keys4.map(
+    (id) => ({
+      id,
+      label: keyToLabel(id)
+    })
+  );
+  return showFields ? schema.filter((f2) => showFields.includes(f2.id) || !f2.id) : schema;
+}
 const bagelInjectionKey = Symbol("bagel");
 const i18nTInjectionKey = Symbol("bagel");
 function useBagel() {
@@ -5372,19 +5387,30 @@ const ModalPlugin = {
     app.component("ModalContainer", ModalComponent);
   }
 };
+function useBglSchema({ schema, showFields, data: data2 } = {}) {
+  let _schema = schema;
+  if (typeof _schema === "function") {
+    _schema = _schema();
+  }
+  if (_schema) {
+    return showFields && showFields.length ? _schema.filter((f2) => showFields.includes(f2.id)) : _schema;
+  }
+  return getFallbackSchema(data2, showFields);
+}
 const _sfc_main$O = /* @__PURE__ */ defineComponent({
   __name: "MaterialIcon",
   props: {
     icon: {},
     name: {},
     size: {},
-    color: {}
+    color: {},
+    weight: {}
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
+      return openBlock(), createElementBlock("span", {
         class: "bgl_icon-font",
-        style: normalizeStyle({ fontSize: `${_ctx.size}rem`, color: _ctx.color })
+        style: normalizeStyle({ fontSize: `${_ctx.size}rem`, color: _ctx.color, "font-variation-settings": `'wght' ${_ctx.weight || 400}` })
       }, toDisplayString(_ctx.icon || _ctx.name), 5);
     };
   }
@@ -5393,7 +5419,7 @@ const _hoisted_1$J = { class: "full-nav" };
 const _hoisted_2$A = { class: "nav-scroll" };
 const _hoisted_3$n = { class: "nav-links-wrapper" };
 const _hoisted_4$f = { class: "tooltip" };
-const _hoisted_5$c = { class: "bot-buttons-wrapper" };
+const _hoisted_5$d = { class: "bot-buttons-wrapper" };
 const _hoisted_6$8 = { class: "tooltip" };
 const _sfc_main$N = /* @__PURE__ */ defineComponent({
   __name: "NavBar",
@@ -5448,7 +5474,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
               }), 128))
             ])
           ]),
-          createElementVNode("div", _hoisted_5$c, [
+          createElementVNode("div", _hoisted_5$d, [
             (openBlock(true), createElementBlock(Fragment$1, null, renderList(_ctx.footerLinks, (link) => {
               return openBlock(), createBlock(resolveDynamicComponent(link.to ? "router-link" : "div"), {
                 key: link.label,
@@ -5515,8 +5541,8 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     useCssVars((_ctx) => ({
-      "5113a6cf": computedBackgroundColor.value,
-      "ae07d62c": cumputedTextColor.value
+      "39397c0e": computedBackgroundColor.value,
+      "427e8569": cumputedTextColor.value
     }));
     const props2 = __props;
     const isComponent = computed(() => {
@@ -5605,7 +5631,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["__scopeId", "data-v-65a6e961"]]);
+const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["__scopeId", "data-v-59ea4a90"]]);
 const _hoisted_1$H = {
   key: 0,
   class: "tool-bar"
@@ -5988,67 +6014,369 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$C = { class: "table-list-wrap h-100" };
-const _hoisted_2$t = { class: "infinite-wrapper" };
-const _hoisted_3$j = { class: "row first-row" };
-const _hoisted_4$d = ["onClick"];
-const _hoisted_5$b = { class: "flex" };
-const _hoisted_6$7 = ["onClick"];
-const _hoisted_7$2 = { key: 1 };
+function tryOnScopeDispose(fn3) {
+  if (getCurrentScope()) {
+    onScopeDispose(fn3);
+    return true;
+  }
+  return false;
+}
+function toValue(r2) {
+  return typeof r2 === "function" ? r2() : unref(r2);
+}
+const isClient = typeof window !== "undefined" && typeof document !== "undefined";
+typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
+function getLifeCycleTarget(target) {
+  return target || getCurrentInstance();
+}
+function tryOnMounted(fn3, sync = true, target) {
+  const instance = getLifeCycleTarget();
+  if (instance)
+    onMounted(fn3, target);
+  else if (sync)
+    fn3();
+  else
+    nextTick(fn3);
+}
+function unrefElement(elRef) {
+  var _a2;
+  const plain = toValue(elRef);
+  return (_a2 = plain == null ? void 0 : plain.$el) != null ? _a2 : plain;
+}
+const defaultWindow = isClient ? window : void 0;
+function useMounted() {
+  const isMounted = ref(false);
+  const instance = getCurrentInstance();
+  if (instance) {
+    onMounted(() => {
+      isMounted.value = true;
+    }, instance);
+  }
+  return isMounted;
+}
+function useSupported(callback) {
+  const isMounted = useMounted();
+  return computed(() => {
+    isMounted.value;
+    return Boolean(callback());
+  });
+}
+function useResizeObserver(target, callback, options = {}) {
+  const { window: window2 = defaultWindow, ...observerOptions } = options;
+  let observer;
+  const isSupported = useSupported(() => window2 && "ResizeObserver" in window2);
+  const cleanup = () => {
+    if (observer) {
+      observer.disconnect();
+      observer = void 0;
+    }
+  };
+  const targets = computed(() => Array.isArray(target) ? target.map((el) => unrefElement(el)) : [unrefElement(target)]);
+  const stopWatch = watch(
+    targets,
+    (els) => {
+      cleanup();
+      if (isSupported.value && window2) {
+        observer = new ResizeObserver(callback);
+        for (const _el of els)
+          _el && observer.observe(_el, observerOptions);
+      }
+    },
+    { immediate: true, flush: "post" }
+  );
+  const stop = () => {
+    cleanup();
+    stopWatch();
+  };
+  tryOnScopeDispose(stop);
+  return {
+    isSupported,
+    stop
+  };
+}
+function useElementSize(target, initialSize = { width: 0, height: 0 }, options = {}) {
+  const { window: window2 = defaultWindow, box = "content-box" } = options;
+  const isSVG = computed(() => {
+    var _a2, _b;
+    return (_b = (_a2 = unrefElement(target)) == null ? void 0 : _a2.namespaceURI) == null ? void 0 : _b.includes("svg");
+  });
+  const width = ref(initialSize.width);
+  const height = ref(initialSize.height);
+  const { stop: stop1 } = useResizeObserver(
+    target,
+    ([entry]) => {
+      const boxSize = box === "border-box" ? entry.borderBoxSize : box === "content-box" ? entry.contentBoxSize : entry.devicePixelContentBoxSize;
+      if (window2 && isSVG.value) {
+        const $elem = unrefElement(target);
+        if ($elem) {
+          const rect = $elem.getBoundingClientRect();
+          width.value = rect.width;
+          height.value = rect.height;
+        }
+      } else {
+        if (boxSize) {
+          const formatBoxSize = Array.isArray(boxSize) ? boxSize : [boxSize];
+          width.value = formatBoxSize.reduce((acc, { inlineSize }) => acc + inlineSize, 0);
+          height.value = formatBoxSize.reduce((acc, { blockSize }) => acc + blockSize, 0);
+        } else {
+          width.value = entry.contentRect.width;
+          height.value = entry.contentRect.height;
+        }
+      }
+    },
+    options
+  );
+  tryOnMounted(() => {
+    const ele = unrefElement(target);
+    if (ele) {
+      width.value = "offsetWidth" in ele ? ele.offsetWidth : initialSize.width;
+      height.value = "offsetHeight" in ele ? ele.offsetHeight : initialSize.height;
+    }
+  });
+  const stop2 = watch(
+    () => unrefElement(target),
+    (ele) => {
+      width.value = ele ? initialSize.width : 0;
+      height.value = ele ? initialSize.height : 0;
+    }
+  );
+  function stop() {
+    stop1();
+    stop2();
+  }
+  return {
+    width,
+    height,
+    stop
+  };
+}
+function useVirtualList(list, options) {
+  const { containerStyle, wrapperProps, scrollTo, calculateRange, currentList, containerRef } = "itemHeight" in options ? useVerticalVirtualList(options, list) : useHorizontalVirtualList(options, list);
+  return {
+    list: currentList,
+    scrollTo,
+    containerProps: {
+      ref: containerRef,
+      onScroll: () => {
+        calculateRange();
+      },
+      style: containerStyle
+    },
+    wrapperProps
+  };
+}
+function useVirtualListResources(list) {
+  const containerRef = ref(null);
+  const size2 = useElementSize(containerRef);
+  const currentList = ref([]);
+  const source = shallowRef(list);
+  const state2 = ref({ start: 0, end: 10 });
+  return { state: state2, source, currentList, size: size2, containerRef };
+}
+function createGetViewCapacity(state2, source, itemSize) {
+  return (containerSize) => {
+    if (typeof itemSize === "number")
+      return Math.ceil(containerSize / itemSize);
+    const { start: start2 = 0 } = state2.value;
+    let sum = 0;
+    let capacity = 0;
+    for (let i2 = start2; i2 < source.value.length; i2++) {
+      const size2 = itemSize(i2);
+      sum += size2;
+      capacity = i2;
+      if (sum > containerSize)
+        break;
+    }
+    return capacity - start2;
+  };
+}
+function createGetOffset(source, itemSize) {
+  return (scrollDirection) => {
+    if (typeof itemSize === "number")
+      return Math.floor(scrollDirection / itemSize) + 1;
+    let sum = 0;
+    let offset2 = 0;
+    for (let i2 = 0; i2 < source.value.length; i2++) {
+      const size2 = itemSize(i2);
+      sum += size2;
+      if (sum >= scrollDirection) {
+        offset2 = i2;
+        break;
+      }
+    }
+    return offset2 + 1;
+  };
+}
+function createCalculateRange(type3, overscan, getOffset, getViewCapacity, { containerRef, state: state2, currentList, source }) {
+  return () => {
+    const element = containerRef.value;
+    if (element) {
+      const offset2 = getOffset(type3 === "vertical" ? element.scrollTop : element.scrollLeft);
+      const viewCapacity = getViewCapacity(type3 === "vertical" ? element.clientHeight : element.clientWidth);
+      const from2 = offset2 - overscan;
+      const to2 = offset2 + viewCapacity + overscan;
+      state2.value = {
+        start: from2 < 0 ? 0 : from2,
+        end: to2 > source.value.length ? source.value.length : to2
+      };
+      currentList.value = source.value.slice(state2.value.start, state2.value.end).map((ele, index2) => ({
+        data: ele,
+        index: index2 + state2.value.start
+      }));
+    }
+  };
+}
+function createGetDistance(itemSize, source) {
+  return (index2) => {
+    if (typeof itemSize === "number") {
+      const size22 = index2 * itemSize;
+      return size22;
+    }
+    const size2 = source.value.slice(0, index2).reduce((sum, _2, i2) => sum + itemSize(i2), 0);
+    return size2;
+  };
+}
+function useWatchForSizes(size2, list, containerRef, calculateRange) {
+  watch([size2.width, size2.height, list, containerRef], () => {
+    calculateRange();
+  });
+}
+function createComputedTotalSize(itemSize, source) {
+  return computed(() => {
+    if (typeof itemSize === "number")
+      return source.value.length * itemSize;
+    return source.value.reduce((sum, _2, index2) => sum + itemSize(index2), 0);
+  });
+}
+const scrollToDictionaryForElementScrollKey = {
+  horizontal: "scrollLeft",
+  vertical: "scrollTop"
+};
+function createScrollTo(type3, calculateRange, getDistance, containerRef) {
+  return (index2) => {
+    if (containerRef.value) {
+      containerRef.value[scrollToDictionaryForElementScrollKey[type3]] = getDistance(index2);
+      calculateRange();
+    }
+  };
+}
+function useHorizontalVirtualList(options, list) {
+  const resources = useVirtualListResources(list);
+  const { state: state2, source, currentList, size: size2, containerRef } = resources;
+  const containerStyle = { overflowX: "auto" };
+  const { itemWidth, overscan = 5 } = options;
+  const getViewCapacity = createGetViewCapacity(state2, source, itemWidth);
+  const getOffset = createGetOffset(source, itemWidth);
+  const calculateRange = createCalculateRange("horizontal", overscan, getOffset, getViewCapacity, resources);
+  const getDistanceLeft = createGetDistance(itemWidth, source);
+  const offsetLeft = computed(() => getDistanceLeft(state2.value.start));
+  const totalWidth = createComputedTotalSize(itemWidth, source);
+  useWatchForSizes(size2, list, containerRef, calculateRange);
+  const scrollTo = createScrollTo("horizontal", calculateRange, getDistanceLeft, containerRef);
+  const wrapperProps = computed(() => {
+    return {
+      style: {
+        height: "100%",
+        width: `${totalWidth.value - offsetLeft.value}px`,
+        marginLeft: `${offsetLeft.value}px`,
+        display: "flex"
+      }
+    };
+  });
+  return {
+    scrollTo,
+    calculateRange,
+    wrapperProps,
+    containerStyle,
+    currentList,
+    containerRef
+  };
+}
+function useVerticalVirtualList(options, list) {
+  const resources = useVirtualListResources(list);
+  const { state: state2, source, currentList, size: size2, containerRef } = resources;
+  const containerStyle = { overflowY: "auto" };
+  const { itemHeight, overscan = 5 } = options;
+  const getViewCapacity = createGetViewCapacity(state2, source, itemHeight);
+  const getOffset = createGetOffset(source, itemHeight);
+  const calculateRange = createCalculateRange("vertical", overscan, getOffset, getViewCapacity, resources);
+  const getDistanceTop = createGetDistance(itemHeight, source);
+  const offsetTop = computed(() => getDistanceTop(state2.value.start));
+  const totalHeight = createComputedTotalSize(itemHeight, source);
+  useWatchForSizes(size2, list, containerRef, calculateRange);
+  const scrollTo = createScrollTo("vertical", calculateRange, getDistanceTop, containerRef);
+  const wrapperProps = computed(() => {
+    return {
+      style: {
+        width: "100%",
+        height: `${totalHeight.value - offsetTop.value}px`,
+        marginTop: `${offsetTop.value}px`
+      }
+    };
+  });
+  return {
+    calculateRange,
+    scrollTo,
+    containerStyle,
+    wrapperProps,
+    currentList,
+    containerRef
+  };
+}
+const _withScopeId$3 = (n2) => (pushScopeId("data-v-73d79ea6"), n2 = n2(), popScopeId(), n2);
+const _hoisted_1$C = {
+  key: 0,
+  class: "loading-table-wrapper z-99 h-100 w-100 absolute inset"
+};
+const _hoisted_2$t = /* @__PURE__ */ _withScopeId$3(() => /* @__PURE__ */ createElementVNode("div", { class: "loading-table-animation absolute oval" }, null, -1));
+const _hoisted_3$j = [
+  _hoisted_2$t
+];
+const _hoisted_4$d = { class: "infinite-wrapper" };
+const _hoisted_5$c = { class: "row first-row" };
+const _hoisted_6$7 = { key: 0 };
+const _hoisted_7$2 = ["onClick"];
+const _hoisted_8$1 = { class: "flex" };
+const _hoisted_9$1 = ["onClick"];
+const _hoisted_10$1 = { key: 0 };
+const _hoisted_11$1 = ["value"];
+const _hoisted_12$1 = { key: 1 };
 const _sfc_main$F = /* @__PURE__ */ defineComponent({
   __name: "TableSchema",
-  props: {
+  props: /* @__PURE__ */ mergeModels({
     selectedItems: {},
     data: {},
     schema: { type: Function },
     showFields: {}
-  },
-  emits: ["update:selectedItems", "orderBy", "select"],
+  }, {
+    "loading": { default: false },
+    "loadingModifiers": {},
+    "itemHeight": { default: 50 },
+    "itemHeightModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["update:selectedItems", "orderBy", "select"], ["update:loading", "update:itemHeight"]),
   setup(__props, { emit: __emit }) {
+    useCssVars((_ctx) => ({
+      "59d71ad2": unref(computedItemHiehgt)
+    }));
     const props2 = __props;
     const emit2 = __emit;
     const slots = useSlots();
-    const loading = ref(true);
-    let selectedItems = ref(props2.selectedItems || []);
-    computed({
-      get: () => selectedItems.value,
-      set: (value) => {
-        selectedItems.value = value;
-        emit2("update:selectedItems", value);
-      }
-    });
-    function selectElement(item) {
-      emit2("select", item);
-    }
-    let sortDirection = ref("ASC");
+    const loading = useModel(__props, "loading");
+    const itemHeight = useModel(__props, "itemHeight");
+    const computedItemHiehgt = computed(() => `${itemHeight.value}px`);
     let sortField = ref("");
+    let sortDirection = ref("ASC");
+    let selectedItems = ref(props2.selectedItems || []);
+    const isSelectable = computed(() => Array.isArray(props2.selectedItems));
     const computedSortField = computed(() => `_transformed_${sortField.value}`);
-    function getFallbackSchema() {
-      const keys4 = [
-        ...new Set((props2.data || []).map(Object.keys).flat())
-      ];
-      const schema = keys4.map((id) => ({
-        id,
-        label: keyToLabel(id)
-      }));
-      return props2.showFields ? schema.filter((f2) => {
-        var _a2;
-        return ((_a2 = props2.showFields) == null ? void 0 : _a2.includes(f2.id)) ?? !f2.id;
-      }) : schema;
-    }
-    const computedSchema = computed(() => {
-      let _schema = props2.schema;
-      if (typeof _schema === "function") {
-        _schema = _schema();
-      }
-      if (_schema) {
-        return props2.showFields ? _schema.filter((f2) => {
-          var _a2;
-          return (_a2 = props2.showFields) == null ? void 0 : _a2.includes(f2.id);
-        }) : _schema;
-      }
-      return getFallbackSchema();
-    });
+    const computedSchema = computed(
+      () => useBglSchema({
+        schema: props2.schema,
+        showFields: props2.showFields,
+        data: props2.data
+      })
+    );
     function transform(rowData) {
       var _a2;
       const obj = { ...rowData };
@@ -6099,68 +6427,138 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
       }
       emit2("orderBy", `${fieldname} ${sortDirection.value}`.trim());
     }
+    const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(
+      computedData,
+      {
+        itemHeight: itemHeight.value,
+        overscan: 10
+      }
+    );
+    watch(
+      () => computedData.value.length,
+      (newLength, oldLength) => {
+        if (newLength === oldLength) return;
+        scrollTo(0);
+      }
+    );
+    const allSelector = ref(null);
+    let computedSelectedItems = computed({
+      get: () => selectedItems.value,
+      set: (value) => {
+        selectedItems.value = value;
+        emit2("update:selectedItems", value);
+        updateAllSelectorState();
+      }
+    });
+    function updateAllSelectorState() {
+      if (!allSelector.value) return;
+      const allSelected = computedData.value.length === computedSelectedItems.value.length && computedData.value.every((s2) => computedSelectedItems.value.includes(s2.id));
+      allSelector.value.checked = allSelected;
+      allSelector.value.indeterminate = !allSelected && computedSelectedItems.value.length > 0;
+    }
+    function toggleSelectItem(item) {
+      if (!computedSelectedItems.value.length) {
+        emit2("select", item);
+        return;
+      }
+      const index2 = computedSelectedItems.value.indexOf(item.id);
+      if (index2 > -1) {
+        computedSelectedItems.value.splice(index2, 1);
+      } else {
+        computedSelectedItems.value.push(item.id);
+      }
+    }
+    function toggleSelectAll(event) {
+      const value = event.target.checked;
+      computedSelectedItems.value = value ? computedData.value.map((d2) => d2.id) : [];
+    }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$C, [
-        createElementVNode("table", _hoisted_2$t, [
-          createElementVNode("thead", _hoisted_3$j, [
-            (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedSchema.value, (field) => {
-              return openBlock(), createElementBlock("th", {
-                key: field.id,
-                class: "col",
-                onClick: ($event) => sort2((field == null ? void 0 : field.id) || "")
-              }, [
-                createElementVNode("div", _hoisted_5$b, [
-                  createTextVNode(toDisplayString(field.label || unref(keyToLabel)(field.id)) + " ", 1),
-                  createElementVNode("div", {
-                    class: normalizeClass(["list-arrows", { sorted: unref(sortField) === field.id }])
-                  }, [
-                    createVNode(unref(_sfc_main$O), {
-                      class: normalizeClass({ desc: unref(sortDirection) === "DESC" }),
-                      icon: "keyboard_arrow_up"
-                    }, null, 8, ["class"])
-                  ], 2)
-                ])
-              ], 8, _hoisted_4$d);
-            }), 128))
-          ]),
-          createElementVNode("tbody", {
-            ref: "infinite",
-            class: normalizeClass(["rows infinite", { loading: loading.value }])
-          }, [
-            (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedData.value, (row) => {
-              return openBlock(), createElementBlock("tr", {
-                key: row.id,
-                class: "row row-item position-relative",
-                onClick: ($event) => selectElement(row)
-              }, [
-                (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedSchema.value, (field) => {
-                  return openBlock(), createElementBlock("td", {
-                    key: `${field.id}-${row.id}`,
-                    class: "col"
-                  }, [
-                    field.id && unref(slots)[field.id] ? renderSlot(_ctx.$slots, field.id, {
-                      key: 0,
-                      row,
-                      field
-                    }, void 0, true) : (openBlock(), createElementBlock("div", _hoisted_7$2, [
-                      createVNode(unref(_sfc_main$p), {
-                        class: "embedded-field",
-                        field,
-                        modelValue: row,
-                        label: ""
-                      }, null, 8, ["field", "modelValue"])
-                    ]))
-                  ]);
-                }), 128))
-              ], 8, _hoisted_6$7);
-            }), 128))
-          ], 2)
-        ])
-      ]);
+      return openBlock(), createElementBlock("div", mergeProps({ class: "table-list-wrap h-100" }, unref(containerProps), {
+        class: { "loading-table": loading.value }
+      }), [
+        loading.value ? (openBlock(), createElementBlock("div", _hoisted_1$C, _hoisted_3$j)) : (openBlock(), createElementBlock("div", normalizeProps(mergeProps({ key: 1 }, unref(wrapperProps))), [
+          createElementVNode("table", _hoisted_4$d, [
+            createElementVNode("thead", _hoisted_5$c, [
+              unref(isSelectable) ? (openBlock(), createElementBlock("th", _hoisted_6$7, [
+                createElementVNode("input", {
+                  ref_key: "allSelector",
+                  ref: allSelector,
+                  type: "checkbox",
+                  onClick: _cache[0] || (_cache[0] = withModifiers(() => {
+                  }, ["stop"])),
+                  onChange: toggleSelectAll
+                }, null, 544)
+              ])) : createCommentVNode("", true),
+              (openBlock(true), createElementBlock(Fragment$1, null, renderList(unref(computedSchema), (field) => {
+                return openBlock(), createElementBlock("th", {
+                  key: field.id,
+                  class: "col",
+                  onClick: ($event) => sort2((field == null ? void 0 : field.id) || "")
+                }, [
+                  createElementVNode("div", _hoisted_8$1, [
+                    createTextVNode(toDisplayString(field.label || unref(keyToLabel)(field.id)) + " ", 1),
+                    createElementVNode("div", {
+                      class: normalizeClass(["list-arrows", { sorted: unref(sortField) === field.id }])
+                    }, [
+                      createVNode(unref(_sfc_main$O), {
+                        class: normalizeClass({ desc: unref(sortDirection) === "DESC" }),
+                        icon: "keyboard_arrow_up"
+                      }, null, 8, ["class"])
+                    ], 2)
+                  ])
+                ], 8, _hoisted_7$2);
+              }), 128))
+            ]),
+            createElementVNode("tbody", null, [
+              (openBlock(true), createElementBlock(Fragment$1, null, renderList(unref(list), ({ data: row }) => {
+                return openBlock(), createElementBlock("tr", {
+                  key: row.id,
+                  class: normalizeClass(["row row-item position-relative", { selected: unref(computedSelectedItems).includes(row.id) }]),
+                  onClick: ($event) => toggleSelectItem(row)
+                }, [
+                  unref(isSelectable) ? (openBlock(), createElementBlock("td", _hoisted_10$1, [
+                    createElementVNode("div", {
+                      onClick: _cache[2] || (_cache[2] = withModifiers(() => {
+                      }, ["stop"]))
+                    }, [
+                      withDirectives(createElementVNode("input", {
+                        "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(computedSelectedItems) ? computedSelectedItems.value = $event : computedSelectedItems = $event),
+                        type: "checkbox",
+                        value: row.id
+                      }, null, 8, _hoisted_11$1), [
+                        [vModelCheckbox, unref(computedSelectedItems)]
+                      ])
+                    ])
+                  ])) : createCommentVNode("", true),
+                  (openBlock(true), createElementBlock(Fragment$1, null, renderList(unref(computedSchema), (field) => {
+                    return openBlock(), createElementBlock("td", {
+                      key: `${field.id}-${row.id}`,
+                      class: "col"
+                    }, [
+                      field.id && unref(slots)[field.id] ? renderSlot(_ctx.$slots, field.id, {
+                        key: 0,
+                        row,
+                        field
+                      }, void 0, true) : (openBlock(), createElementBlock("div", _hoisted_12$1, [
+                        createVNode(unref(_sfc_main$p), {
+                          class: "embedded-field",
+                          field,
+                          modelValue: row,
+                          label: ""
+                        }, null, 8, ["field", "modelValue"])
+                      ]))
+                    ]);
+                  }), 128))
+                ], 10, _hoisted_9$1);
+              }), 128))
+            ])
+          ])
+        ], 16))
+      ], 16);
     };
   }
 });
-const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-1628cf1a"]]);
+const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-73d79ea6"]]);
 const _sfc_main$E = {};
 const _hoisted_1$B = { class: "flex space-between" };
 function _sfc_render$1(_ctx, _cache) {
@@ -6202,7 +6600,7 @@ const _hoisted_2$s = {
 };
 const _hoisted_3$i = { class: "key" };
 const _hoisted_4$c = { key: 1 };
-const _hoisted_5$a = { class: "key" };
+const _hoisted_5$b = { class: "key" };
 const _hoisted_6$6 = { class: "vlue" };
 const _sfc_main$C = /* @__PURE__ */ defineComponent({
   __name: "DataPreview",
@@ -6218,16 +6616,12 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props2 = __props;
     const itemData = useModel(__props, "data");
-    const computedSchema = computed(() => {
-      const schema = Object.keys(itemData.value);
-      if (props2.showFields && props2.showFields.length) {
-        return schema.filter((field) => {
-          var _a2;
-          return (_a2 = props2.showFields) == null ? void 0 : _a2.includes(field);
-        });
-      }
-      return schema;
-    });
+    const computedSchema = computed(
+      () => getFallbackSchema(
+        [itemData.value],
+        props2.showFields
+      )
+    );
     return (_ctx, _cache) => {
       var _a2;
       return __props.data ? (openBlock(), createElementBlock("div", _hoisted_1$A, [
@@ -6252,13 +6646,13 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
           ], 64);
         }), 128)),
         !((_a2 = _ctx.schema) == null ? void 0 : _a2.length) ? (openBlock(), createElementBlock("div", _hoisted_4$c, [
-          (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedSchema.value, (key) => {
+          (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedSchema.value, ({ id, label }) => {
             return openBlock(), createElementBlock("div", {
-              key,
+              key: id,
               class: "data-row"
             }, [
-              createElementVNode("div", _hoisted_5$a, toDisplayString(unref(keyToLabel)(key)), 1),
-              createElementVNode("div", _hoisted_6$6, toDisplayString(itemData.value[key]), 1)
+              createElementVNode("div", _hoisted_5$b, toDisplayString(label), 1),
+              createElementVNode("div", _hoisted_6$6, toDisplayString(itemData.value[id ?? ""]), 1)
             ]);
           }), 128))
         ])) : createCommentVNode("", true),
@@ -6267,7 +6661,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["__scopeId", "data-v-078d6853"]]);
+const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["__scopeId", "data-v-2281300f"]]);
 const _hoisted_1$z = {
   key: 0,
   class: "card_label"
@@ -16315,7 +16709,6 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
       if (props2.address) {
         geocodeAddress(props2.address).catch(console.error);
       }
-      console.log(props2.zoomControl, props2.center);
       map4.value = L$1.map(id.value, {
         center: props2.center,
         zoom: props2.zoom,
@@ -16335,7 +16728,8 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
     }
     async function geocodeAddress(address) {
       var _a2;
-      const geocodeUrl = `https://nominatim.openstreetmap.org/search?format=json&q=${encodeURIComponent(address)}`;
+      const addressURL = address.replace(/\s+/g, "+");
+      const geocodeUrl = `https://nominatim.openstreetmap.org/search?format=json&q=${encodeURI(addressURL)}`;
       const res = await fetch(geocodeUrl);
       const data2 = await res.json() || [];
       data2.forEach((element) => {
@@ -16620,16 +17014,20 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     id: {},
     title: {},
     small: { type: Boolean },
-    required: { type: Boolean }
+    required: { type: Boolean },
+    defaultValue: { type: Boolean, default: false }
   }, {
-    "modelValue": { type: Boolean, ...{ default: false } },
+    "modelValue": { type: Boolean, ...{ default: void 0 } },
     "modelModifiers": {}
   }),
   emits: ["update:modelValue"],
   setup(__props) {
     const props2 = __props;
-    const inputId = ref(props2.id || Math.random().toString(36).substring(7));
+    const inputId = computed(() => props2.id || Math.random().toString(36).substring(7));
     const checked = useModel(__props, "modelValue");
+    onMounted(() => {
+      if (checked.value === void 0) checked.value = props2.defaultValue;
+    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["bagel-input bgl-checkbox align-items-center ps-025", { small: _ctx.small }]),
@@ -16653,7 +17051,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const CheckInput = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-ac068f18"]]);
+const CheckInput = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-e8fcfd5e"]]);
 function toDate(argument) {
   const argStr = Object.prototype.toString.call(argument);
   if (argument instanceof Date || typeof argument === "object" && argStr === "[object Date]") {
@@ -25108,6 +25506,7 @@ const _hoisted_2$m = { key: 0 };
 const _sfc_main$n = /* @__PURE__ */ defineComponent({
   __name: "DateInput",
   props: {
+    required: { type: Boolean },
     label: {},
     editMode: { type: Boolean, default: true },
     small: { type: Boolean, default: false },
@@ -25152,6 +25551,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
           ref: datePicker,
           modelValue: date2.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => date2.value = $event),
+          required: _ctx.required,
           "auto-apply": true,
           "enable-time-picker": _ctx.enableTime,
           "allowed-dates": _ctx.allowedDates
@@ -25160,7 +25560,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
           "minutes-increment": _ctx.minutesIncrement,
           "minutes-grid-increment": _ctx.minutesGridIncrement,
           "start-time": { hours: 8, minutes: 0 }
-        }), null, 16, ["modelValue", "enable-time-picker", "allowed-dates", "time-picker-inline", "minutes-increment", "minutes-grid-increment"])
+        }), null, 16, ["modelValue", "required", "enable-time-picker", "allowed-dates", "time-picker-inline", "minutes-increment", "minutes-grid-increment"])
       ], 10, _hoisted_1$s);
     };
   }
@@ -27905,7 +28305,7 @@ const _hoisted_1$p = ["title"];
 const _hoisted_2$j = { class: "bagel-input" };
 const _hoisted_3$e = { class: "table-side-scroll" };
 const _hoisted_4$a = { class: "table-header" };
-const _hoisted_5$9 = { class: "table-reorder" };
+const _hoisted_5$a = { class: "table-reorder" };
 const _hoisted_6$5 = { class: "table-action" };
 const _sfc_main$k = /* @__PURE__ */ defineComponent({
   __name: "TableField",
@@ -28003,7 +28403,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
                       key: row.id,
                       class: "flex table-row"
                     }, [
-                      createElementVNode("div", _hoisted_5$9, [
+                      createElementVNode("div", _hoisted_5$a, [
                         createVNode(unref(_sfc_main$O), { icon: "more_vert" })
                       ]),
                       (openBlock(true), createElementBlock(Fragment$1, null, renderList((_a3 = unref(entityMeta)) == null ? void 0 : _a3.fields, (field) => {
@@ -28056,7 +28456,7 @@ const _hoisted_1$o = ["title"];
 const _hoisted_2$i = ["for"];
 const _hoisted_3$d = ["id", "title", "autocomplete", "type", "placeholder", "disabled", "required", "pattern"];
 const _hoisted_4$9 = ["id", "title", "type", "rows", "placeholder", "disabled", "required", "pattern"];
-const _hoisted_5$8 = { key: 2 };
+const _hoisted_5$9 = { key: 2 };
 const _sfc_main$j = /* @__PURE__ */ defineComponent({
   __name: "TextInput",
   props: {
@@ -28162,7 +28562,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
           }, _ctx.nativeInputAttrs, { onInput: updateInputVal }), null, 16, _hoisted_4$9)), [
             [vModelText, unref(inputVal)]
           ]),
-          _ctx.helptext ? (openBlock(), createElementBlock("p", _hoisted_5$8, toDisplayString(_ctx.helptext), 1)) : createCommentVNode("", true)
+          _ctx.helptext ? (openBlock(), createElementBlock("p", _hoisted_5$9, toDisplayString(_ctx.helptext), 1)) : createCommentVNode("", true)
         ], 8, _hoisted_2$i),
         _ctx.iconStart ? (openBlock(), createBlock(unref(_sfc_main$O), {
           key: 0,
@@ -28262,7 +28662,7 @@ const _hoisted_3$c = {
   class: "time-wrap"
 };
 const _hoisted_4$8 = ["id", "name", "value"];
-const _hoisted_5$7 = ["for"];
+const _hoisted_5$8 = ["for"];
 const _sfc_main$g = /* @__PURE__ */ defineComponent({
   __name: "DatePicker",
   props: {
@@ -28325,7 +28725,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
               ]),
               createElementVNode("label", {
                 for: `${hr2}_${_ctx.id}`
-              }, toDisplayString(hr2), 9, _hoisted_5$7)
+              }, toDisplayString(hr2), 9, _hoisted_5$8)
             ], 64);
           }), 128))
         ])) : createCommentVNode("", true)
@@ -28337,7 +28737,7 @@ const _hoisted_1$k = { class: "bagel-input" };
 const _hoisted_2$f = { class: "pb-025" };
 const _hoisted_3$b = { class: "flex gap-05 flex-wrap" };
 const _hoisted_4$7 = ["id", "name", "value", "checked"];
-const _hoisted_5$6 = ["for"];
+const _hoisted_5$7 = ["for"];
 const _sfc_main$f = /* @__PURE__ */ defineComponent({
   __name: "RadioPillsInput",
   props: {
@@ -28397,7 +28797,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
               }, null, 40, _hoisted_4$7),
               createElementVNode("label", {
                 for: `${_ctx.id}-${getValue(option2)}`
-              }, toDisplayString(getLabel(option2)), 9, _hoisted_5$6)
+              }, toDisplayString(getLabel(option2)), 9, _hoisted_5$7)
             ]);
           }), 128))
         ])
@@ -28406,7 +28806,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
   }
 });
 const RadioPillsInput = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-681173be"]]);
-const _withScopeId$2 = (n2) => (pushScopeId("data-v-82316bcb"), n2 = n2(), popScopeId(), n2);
+const _withScopeId$2 = (n2) => (pushScopeId("data-v-1ce244aa"), n2 = n2(), popScopeId(), n2);
 const _hoisted_1$j = { class: "bagel-input" };
 const _hoisted_2$e = {
   key: 0,
@@ -28417,7 +28817,7 @@ const _hoisted_4$6 = {
   key: 1,
   class: "multi-image-item previewName"
 };
-const _hoisted_5$5 = ["src"];
+const _hoisted_5$6 = ["src"];
 const _hoisted_6$4 = { class: "no-margin" };
 const _hoisted_7$1 = {
   key: 0,
@@ -28434,25 +28834,23 @@ const _hoisted_12 = {
 const _hoisted_13 = /* @__PURE__ */ _withScopeId$2(() => /* @__PURE__ */ createElementVNode("p", null, "Drop files here or click to upload", -1));
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   __name: "FileUpload",
-  props: /* @__PURE__ */ mergeModels({
+  props: {
     label: {},
     multiple: { type: Boolean },
     files: {},
     deleteEndpoint: {},
     bindkey: {},
+    modelValue: {},
     width: {}
-  }, {
-    "modelValue": {},
-    "modelModifiers": {}
-  }),
+  },
   emits: ["update:modelValue"],
-  setup(__props) {
+  setup(__props, { emit: __emit }) {
     const props2 = __props;
     const bagel = useBagel();
     const bindKey2 = props2.bindkey || "id";
-    const file_bindkeys = useModel(__props, "modelValue");
+    const emit2 = __emit;
+    let file_bindkeys = ref(props2.modelValue || []);
     const storageFiles = ref([]);
-    const compareIds = (v1, v2) => [v1].flat().join(",") === [v2].flat().join(",");
     onMounted(() => {
       if (!props2.files && [file_bindkeys.value].flat().length) {
         const ids = [file_bindkeys.value].flat().filter(Boolean);
@@ -28482,21 +28880,19 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
       },
       { immediate: true }
     );
-    watch(
-      () => storageFiles.value,
-      (newFiles) => {
-        let idValue;
-        if (props2.multiple) {
-          idValue = newFiles.map((f2) => f2[bindKey2]);
-        } else {
-          idValue = newFiles[0][bindKey2] || "";
-        }
-        if (!compareIds(file_bindkeys.value, idValue)) {
-          file_bindkeys.value = idValue;
-        }
-      },
-      { deep: true }
-    );
+    function updateModelValue() {
+      let idValue;
+      if (props2.multiple) {
+        idValue = storageFiles.value.map((f2) => f2[bindKey2]);
+      } else {
+        idValue = storageFiles.value[0][bindKey2] || "";
+      }
+      const isSame = [idValue].flat().every((id) => [file_bindkeys.value].flat().includes(id));
+      if (!isSame) {
+        file_bindkeys.value = idValue;
+        emit2("update:modelValue", file_bindkeys.value);
+      }
+    }
     const fileQueue = ref([]);
     let isDragOver = ref(false);
     function preventDefault(e) {
@@ -28510,16 +28906,20 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
       if (props2.deleteEndpoint) {
         void bagel.delete(`${props2.deleteEndpoint}/${file.id}`);
       }
+      updateModelValue();
     }
-    function flushQueue() {
-      fileQueue.value.forEach(async (file, i2) => {
+    async function flushQueue() {
+      for (const file of fileQueue.value) {
+        file.uploading = true;
         if (!props2.multiple) storageFiles.value.splice(0, 1);
         const serverFile = await bagel.uploadFile(file.file, {
           onUploadProgress: (e) => file.progress = e.progress * 100 - 1
         });
         storageFiles.value.push(serverFile);
+        const i2 = fileQueue.value.indexOf(file);
         fileQueue.value.splice(i2, 1);
-      });
+      }
+      updateModelValue();
     }
     function browse() {
       const input = document.createElement("input");
@@ -28528,7 +28928,9 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
       input.onchange = (e) => {
         const target = e.target;
         if (target.files) {
-          Array.from(target.files).forEach((file) => fileQueue.value.push({ name: file.name, file, progress: 0 }));
+          Array.from(target.files).forEach(
+            (file) => fileQueue.value.push({ name: file.name, file, progress: 0 })
+          );
         }
         flushQueue();
       };
@@ -28547,7 +28949,9 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     function drop3(e) {
       preventDefault(e);
       if (e.dataTransfer) {
-        Array.from(e.dataTransfer.files).forEach((file) => fileQueue.value.push({ name: file.name, file, progress: 0 }));
+        Array.from(e.dataTransfer.files).forEach(
+          (file) => fileQueue.value.push({ name: file.name, file, progress: 0 })
+        );
       }
       isDragOver.value = false;
       flushQueue();
@@ -28585,7 +28989,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
                     class: "preview",
                     src: file.url,
                     alt: ""
-                  }, null, 8, _hoisted_5$5),
+                  }, null, 8, _hoisted_5$6),
                   createElementVNode("p", _hoisted_6$4, toDisplayString(file.name), 1),
                   createVNode(unref(Btn), {
                     thin: "",
@@ -28642,14 +29046,15 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const $el = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-82316bcb"]]);
-const _withScopeId$1 = (n2) => (pushScopeId("data-v-50198c44"), n2 = n2(), popScopeId(), n2);
+const $el = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-1ce244aa"]]);
+const _withScopeId$1 = (n2) => (pushScopeId("data-v-eceeebfb"), n2 = n2(), popScopeId(), n2);
 const _hoisted_1$i = ["title"];
 const _hoisted_2$d = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("span", { class: "slider round" }, null, -1));
 const _hoisted_3$9 = [
   _hoisted_2$d
 ];
-const _hoisted_4$5 = ["id"];
+const _hoisted_4$5 = ["id", "required"];
+const _hoisted_5$5 = ["for"];
 const _sfc_main$d = /* @__PURE__ */ defineComponent({
   __name: "ToggleInput",
   props: /* @__PURE__ */ mergeModels({
@@ -28657,14 +29062,16 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
     id: {},
     title: {},
     small: { type: Boolean },
+    required: { type: Boolean },
     defaultValue: { type: Boolean, default: false }
   }, {
-    "modelValue": { type: Boolean },
+    "modelValue": { type: Boolean, ...{ default: void 0 } },
     "modelModifiers": {}
   }),
   emits: ["update:modelValue"],
   setup(__props) {
     const props2 = __props;
+    const inputId = ref(props2.id || Math.random().toString(36).substring(7));
     const checked = useModel(__props, "modelValue");
     onMounted(() => {
       if (checked.value === void 0) checked.value = props2.defaultValue;
@@ -28672,26 +29079,30 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["bagel-input bgl-checkbox justify-content-center gap-1", { small: _ctx.small }]),
-        title: _ctx.title
+        title: _ctx.title,
+        onClick: _cache[1] || (_cache[1] = withModifiers(($event) => checked.value = !checked.value, ["prevent"]))
       }, [
         createElementVNode("div", {
           class: normalizeClass(["switch", { checked: checked.value }])
         }, _hoisted_3$9, 2),
-        createElementVNode("label", null, [
-          createTextVNode(toDisplayString(_ctx.label) + " ", 1),
-          withDirectives(createElementVNode("input", {
-            id: _ctx.id,
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => checked.value = $event),
-            type: "checkbox"
-          }, null, 8, _hoisted_4$5), [
-            [vModelCheckbox, checked.value]
-          ])
-        ])
+        withDirectives(createElementVNode("input", {
+          id: inputId.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => checked.value = $event),
+          type: "checkbox",
+          required: _ctx.required
+        }, null, 8, _hoisted_4$5), [
+          [vModelCheckbox, checked.value]
+        ]),
+        createElementVNode("label", { for: inputId.value }, [
+          renderSlot(_ctx.$slots, "label", {}, () => [
+            createTextVNode(toDisplayString(_ctx.label), 1)
+          ], true)
+        ], 8, _hoisted_5$5)
       ], 10, _hoisted_1$i);
     };
   }
 });
-const ToggleInput = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-50198c44"]]);
+const ToggleInput = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-eceeebfb"]]);
 function OrderedMap(content) {
   this.content = content;
 }
@@ -62525,7 +62936,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const TabbedLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-bb096cbe"]]);
+const TabbedLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-70d6cf78"]]);
 const countryArray = [
   ["Afghanistan (افغانستان)", "AF", "93"],
   ["Albania (Shqipëri)", "AL", "355"],
@@ -62913,12 +63324,14 @@ export {
   debounce$2 as debounce,
   denullify,
   formatString,
+  getFallbackSchema,
   i18nTInjectionKey,
   iffer,
   initials,
   isDate$1 as isDate,
   keyToLabel,
   useBagel,
+  useBglSchema,
   useEscape,
   useI18nT,
   useLang,