@bagelink/vue 0.0.787 → 0.0.791

package/dist/index.cjs

@@ -40,7 +40,7 @@ const bagelFormUtils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defi
     return txtField;
   }
 }, Symbol.toStringTag, { value: "Module" }));
-const _sfc_main$W = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$Y = /* @__PURE__ */ vue.defineComponent({
   __name: "Accordion",
   setup(__props) {
     const state2 = vue.reactive({
@@ -54,11 +54,11 @@ const _sfc_main$W = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$K = { class: "accordion-item" };
-const _hoisted_2$v = ["aria-expanded", "aria-controls"];
-const _hoisted_3$l = { class: "accordion-label" };
-const _hoisted_4$f = ["id", "aria-hidden"];
-const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$M = { class: "accordion-item" };
+const _hoisted_2$w = ["aria-expanded", "aria-controls"];
+const _hoisted_3$m = { class: "accordion-label" };
+const _hoisted_4$g = ["id", "aria-hidden"];
+const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
   __name: "AccordionItem",
   props: {
     label: {},
@@ -95,7 +95,7 @@ const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
       else if (accordionState.openItem === id) accordionState.openItem = null;
     }
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$K, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$M, [
         vue.createElementVNode("button", {
           "aria-expanded": vue.unref(isOpen) ? "true" : "false",
           class: "accordion-head",
@@ -103,14 +103,14 @@ const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
           onClick: _cache[0] || (_cache[0] = ($event) => toggle())
         }, [
           vue.renderSlot(_ctx.$slots, "head", {}, () => [
-            vue.createElementVNode("span", _hoisted_3$l, vue.toDisplayString(_ctx.label), 1)
+            vue.createElementVNode("span", _hoisted_3$m, vue.toDisplayString(_ctx.label), 1)
           ], true),
           vue.createElementVNode("div", {
             class: vue.normalizeClass(["accordion-icon", { open: vue.unref(isOpen) }])
           }, [
             vue.createVNode(vue.unref(_sfc_main$c), { icon: "expand_more" })
           ], 2)
-        ], 8, _hoisted_2$v),
+        ], 8, _hoisted_2$w),
         vue.createVNode(vue.Transition, { name: "expand" }, {
           default: vue.withCtx(() => [
             vue.unref(isOpen) ? (vue.openBlock(), vue.createElementBlock("div", {
@@ -120,7 +120,7 @@ const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
               "aria-hidden": vue.unref(isOpen) ? "false" : "true"
             }, [
               vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
-            ], 8, _hoisted_4$f)) : vue.createCommentVNode("", true)
+            ], 8, _hoisted_4$g)) : vue.createCommentVNode("", true)
           ]),
           _: 3
         })
@@ -135,9 +135,9 @@ const _export_sfc = (sfc, props2) => {
   }
   return target;
 };
-const AccordionItem = /* @__PURE__ */ _export_sfc(_sfc_main$V, [["__scopeId", "data-v-f87b579d"]]);
-const _hoisted_1$J = { class: "relative" };
-const _sfc_main$U = /* @__PURE__ */ vue.defineComponent({
+const AccordionItem = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-f87b579d"]]);
+const _hoisted_1$L = { class: "relative" };
+const _sfc_main$W = /* @__PURE__ */ vue.defineComponent({
   __name: "AddressSearch",
   emits: ["addressSelected"],
   setup(__props, { emit: __emit }) {
@@ -159,8 +159,8 @@ const _sfc_main$U = /* @__PURE__ */ vue.defineComponent({
       (_a2 = suggestion.value) == null ? void 0 : _a2.show();
     }
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$J, [
-        vue.createVNode(vue.unref(_sfc_main$K), {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$L, [
+        vue.createVNode(vue.unref(_sfc_main$M), {
           ref_key: "suggestion",
           ref: suggestion,
           noAutoFocus: true,
@@ -195,15 +195,15 @@ const _sfc_main$U = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$I = {
+const _hoisted_1$K = {
   key: 0,
   class: "loading"
 };
-const _hoisted_2$u = {
+const _hoisted_2$v = {
   key: 1,
   class: "bgl_btn-flex"
 };
-const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
   __name: "Btn",
   props: {
     disabled: { type: Boolean, default: false },
@@ -297,7 +297,7 @@ const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
         onClick: vue.withModifiers(_ctx.onClick, ["stop"])
       }, {
         default: vue.withCtx(() => [
-          _ctx.loading ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$I)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$u, [
+          _ctx.loading ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$K)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$v, [
             _ctx.icon ? (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
               key: 0,
               icon: _ctx.icon
@@ -317,10 +317,10 @@ const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$T, [["__scopeId", "data-v-047c9778"]]);
-const _hoisted_1$H = ["dismissable"];
-const _hoisted_2$t = { class: "m-0" };
-const _sfc_main$S = /* @__PURE__ */ vue.defineComponent({
+const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$V, [["__scopeId", "data-v-047c9778"]]);
+const _hoisted_1$J = ["dismissable"];
+const _hoisted_2$u = { class: "m-0" };
+const _sfc_main$U = /* @__PURE__ */ vue.defineComponent({
   __name: "Alert",
   props: {
     message: {},
@@ -348,7 +348,7 @@ const _sfc_main$S = /* @__PURE__ */ vue.defineComponent({
           size: 2,
           color: color2[_ctx.type]
         }, null, 8, ["icon", "color"])) : vue.createCommentVNode("", true),
-        vue.createElementVNode("p", _hoisted_2$t, vue.toDisplayString(_ctx.message), 1),
+        vue.createElementVNode("p", _hoisted_2$u, vue.toDisplayString(_ctx.message), 1),
         vue.createVNode(Btn, {
           flat: "",
           thin: "",
@@ -356,13 +356,13 @@ const _sfc_main$S = /* @__PURE__ */ vue.defineComponent({
           icon: "close",
           onClick: _cache[0] || (_cache[0] = ($event) => isDismissed.value = true)
         })
-      ], 10, _hoisted_1$H)) : vue.createCommentVNode("", true);
+      ], 10, _hoisted_1$J)) : vue.createCommentVNode("", true);
     };
   }
 });
-const Alert = /* @__PURE__ */ _export_sfc(_sfc_main$S, [["__scopeId", "data-v-57141c32"]]);
-const _hoisted_1$G = ["src", "alt"];
-const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
+const Alert = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["__scopeId", "data-v-57141c32"]]);
+const _hoisted_1$I = ["src", "alt"];
+const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
   __name: "Avatar",
   props: {
     fallback: {},
@@ -380,7 +380,7 @@ const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
           key: 0,
           src: _ctx.src,
           alt: _ctx.name
-        }, null, 8, _hoisted_1$G)) : (vue.openBlock(), vue.createElementBlock("p", {
+        }, null, 8, _hoisted_1$I)) : (vue.openBlock(), vue.createElementBlock("p", {
           key: 1,
           style: vue.normalizeStyle({ "line-height": `${_ctx.size}px`, "font-size": `calc(1.5rem * ${_ctx.size} / 50)` })
         }, vue.toDisplayString((_ctx.fallback || vue.unref(initials)(_ctx.name || "")).toUpperCase()), 5))
@@ -388,8 +388,8 @@ const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main$R, [["__scopeId", "data-v-46ad8c25"]]);
-const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
+const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main$T, [["__scopeId", "data-v-46ad8c25"]]);
+const _sfc_main$S = /* @__PURE__ */ vue.defineComponent({
   __name: "Badge",
   props: {
     color: {},
@@ -420,10 +420,10 @@ const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Badge = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["__scopeId", "data-v-40a0b03a"]]);
-const _hoisted_1$F = ["src"];
-const _hoisted_2$s = ["src", "autoplay", "muted", "loop", "controls"];
-const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
+const Badge = /* @__PURE__ */ _export_sfc(_sfc_main$S, [["__scopeId", "data-v-40a0b03a"]]);
+const _hoisted_1$H = ["src"];
+const _hoisted_2$t = ["src", "autoplay", "muted", "loop", "controls"];
+const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
   __name: "BglVideo",
   props: {
     src: {},
@@ -478,7 +478,7 @@ const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
           allowfullscreen: "",
           title: "Video",
           allow: "autoplay"
-        }, null, 12, _hoisted_1$F)) : _ctx.src ? (vue.openBlock(), vue.createElementBlock("video", {
+        }, null, 12, _hoisted_1$H)) : _ctx.src ? (vue.openBlock(), vue.createElementBlock("video", {
           key: 1,
           src: _ctx.src,
           autoplay: _ctx.autoplay,
@@ -487,17 +487,17 @@ const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
           style: vue.normalizeStyle({ aspectRatio: aspectRatio.value }),
           controls: _ctx.controls,
           playsinline: ""
-        }, null, 12, _hoisted_2$s)) : vue.createCommentVNode("", true)
+        }, null, 12, _hoisted_2$t)) : vue.createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const BglVideo = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["__scopeId", "data-v-8495afe2"]]);
-const _hoisted_1$E = {
+const BglVideo = /* @__PURE__ */ _export_sfc(_sfc_main$R, [["__scopeId", "data-v-8495afe2"]]);
+const _hoisted_1$G = {
   key: 0,
   class: "card_label"
 };
-const _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
   __name: "Card",
   props: {
     label: {},
@@ -525,7 +525,7 @@ const _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
         }])
       }, {
         default: vue.withCtx(() => [
-          _ctx.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$E, vue.toDisplayString(_ctx.label), 1)) : vue.createCommentVNode("", true),
+          _ctx.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$G, vue.toDisplayString(_ctx.label), 1)) : vue.createCommentVNode("", true),
           vue.renderSlot(_ctx.$slots, "default")
         ]),
         _: 3
@@ -533,12 +533,12 @@ const _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$D = {
+const _hoisted_1$F = {
   key: 0,
   class: "blocker"
 };
-const _hoisted_2$r = { class: "Handlers" };
-const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_2$s = { class: "Handlers" };
+const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
   __name: "Carousel",
   props: {
     autoHeight: {
@@ -686,10 +686,10 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
           onScrollend: scrollEnd,
           onMousedown: startDragging
         }, [
-          vue.unref(isDragging) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$D)) : vue.createCommentVNode("", true),
+          vue.unref(isDragging) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$F)) : vue.createCommentVNode("", true),
           vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
         ], 34),
-        vue.createElementVNode("div", _hoisted_2$r, [
+        vue.createElementVNode("div", _hoisted_2$s, [
           vue.createElementVNode("span", { onClick: prev }, [
             vue.renderSlot(_ctx.$slots, "prev", {
               prev,
@@ -707,7 +707,7 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Carousel = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["__scopeId", "data-v-1f9c6644"]]);
+const Carousel = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["__scopeId", "data-v-1f9c6644"]]);
 function _isPlaceholder(a2) {
   return a2 != null && typeof a2 === "object" && a2["@@functional/placeholder"] === true;
 }
@@ -6538,8 +6538,8 @@ const _hoisted_1$1$1 = {
   style: { display: "flex", position: "relative" }
 };
 const _hoisted_2$1$1 = ["width", "height", "viewBox"];
-const _hoisted_3$k = { class: "layer-rectangles" };
-const _hoisted_4$e = ["transform", "onMouseover"];
+const _hoisted_3$l = { class: "layer-rectangles" };
+const _hoisted_4$f = ["transform", "onMouseover"];
 const _hoisted_5$d = ["width", "height"];
 const _hoisted_6$a = {
   x: 0 + 10,
@@ -6556,7 +6556,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       viewBox: `0 0 ${_ctx.size.width} ${_ctx.size.height}`,
       ref: "el"
     }, [
-      vue.createElementVNode("g", _hoisted_3$k, [
+      vue.createElementVNode("g", _hoisted_3$l, [
         (vue.openBlock(true), vue.createElementBlock(
           vue.Fragment,
           null,
@@ -6591,7 +6591,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
                   )
                 ])
               ])
-            ], 42, _hoisted_4$e);
+            ], 42, _hoisted_4$f);
           }),
           128
           /* KEYED_FRAGMENT */
@@ -6648,25 +6648,25 @@ var script = vue.defineComponent({
     return { bar, canvas, direction, mouse };
   }
 });
-const _hoisted_1$C = {
+const _hoisted_1$E = {
   key: 0,
   class: "layer-hover-bar"
 };
-const _hoisted_2$q = ["x", "y", "width", "height"];
+const _hoisted_2$r = ["x", "y", "width", "height"];
 function render$e(_ctx, _cache, $props, $setup, $data, $options) {
-  return _ctx.mouse.hover ? (vue.openBlock(), vue.createElementBlock("g", _hoisted_1$C, [
+  return _ctx.mouse.hover ? (vue.openBlock(), vue.createElementBlock("g", _hoisted_1$E, [
     vue.createElementVNode("rect", vue.mergeProps({ class: "hover-bar" }, _ctx.barStyle, {
       x: _ctx.bar.x,
       y: _ctx.bar.y,
       width: _ctx.bar.width > 0 ? _ctx.bar.width : 0,
       height: _ctx.bar.height > 0 ? _ctx.bar.height : 0
-    }), null, 16, _hoisted_2$q)
+    }), null, 16, _hoisted_2$r)
   ])) : vue.createCommentVNode("v-if", true);
 }
 script.render = render$e;
 script.__file = "src/components/HoverBar/index.vue";
 const BRAND_COLOR = "var(--bgl-primary)";
-const _sfc_main$M = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
   __name: "Lineart",
   props: {
     data: {},
@@ -6806,16 +6806,16 @@ const _sfc_main$M = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$B = {
+const _hoisted_1$D = {
   key: 0,
   class: "data"
 };
-const _hoisted_2$p = {
+const _hoisted_2$q = {
   key: 0,
   class: "data-row m_py-05"
 };
-const _hoisted_3$j = { class: "key" };
-const _hoisted_4$d = { class: "m-0" };
+const _hoisted_3$k = { class: "key" };
+const _hoisted_4$e = { class: "m-0" };
 const _hoisted_5$c = { key: 1 };
 const _hoisted_6$9 = {
   key: 0,
@@ -6827,7 +6827,7 @@ const _hoisted_9$3 = {
   key: 0,
   class: "m-0"
 };
-const _sfc_main$L = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
   __name: "DataPreview",
   props: /* @__PURE__ */ vue.mergeModels({
     showFields: {},
@@ -6863,7 +6863,7 @@ const _sfc_main$L = /* @__PURE__ */ vue.defineComponent({
     const computedSchema = vue.computed(() => getFallbackSchema([itemData.value], props2.showFields));
     return (_ctx, _cache) => {
       var _a2;
-      return __props.data ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$B, [
+      return __props.data ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$D, [
         _ctx.title ? (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$3), {
           key: 0,
           label: _ctx.title
@@ -6872,11 +6872,11 @@ const _sfc_main$L = /* @__PURE__ */ vue.defineComponent({
           return vue.openBlock(), vue.createElementBlock(vue.Fragment, {
             key: field.id
           }, [
-            vue.unref(iffer)(field, itemData.value) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$p, [
-              vue.createElementVNode("div", _hoisted_3$j, [
-                vue.createElementVNode("p", _hoisted_4$d, vue.toDisplayString((field == null ? void 0 : field.label) || vue.unref(keyToLabel)(field.id)), 1)
+            vue.unref(iffer)(field, itemData.value) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$q, [
+              vue.createElementVNode("div", _hoisted_3$k, [
+                vue.createElementVNode("p", _hoisted_4$e, vue.toDisplayString((field == null ? void 0 : field.label) || vue.unref(keyToLabel)(field.id)), 1)
               ]),
-              vue.createVNode(vue.unref(_sfc_main$I), {
+              vue.createVNode(vue.unref(_sfc_main$K), {
                 modelValue: itemData.value,
                 "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => itemData.value = $event),
                 label: "",
@@ -6905,7 +6905,7 @@ const _sfc_main$L = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$L, [["__scopeId", "data-v-5f91f598"]]);
+const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["__scopeId", "data-v-5f91f598"]]);
 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]), []);
@@ -9447,7 +9447,7 @@ const Gt$1 = {
   install: Ct$1,
   options: h
 };
-const _sfc_main$K = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$M = /* @__PURE__ */ vue.defineComponent({
   __name: "Dropdown",
   props: {
     value: {},
@@ -9504,7 +9504,7 @@ const _sfc_main$K = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$L = /* @__PURE__ */ vue.defineComponent({
   __name: "Flag",
   props: {
     country: {},
@@ -9534,8 +9534,8 @@ const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Flag = /* @__PURE__ */ _export_sfc(_sfc_main$J, [["__scopeId", "data-v-f99f1900"]]);
-const _sfc_main$I = /* @__PURE__ */ vue.defineComponent({
+const Flag = /* @__PURE__ */ _export_sfc(_sfc_main$L, [["__scopeId", "data-v-f99f1900"]]);
+const _sfc_main$K = /* @__PURE__ */ vue.defineComponent({
   __name: "BglField",
   props: {
     field: {},
@@ -9551,7 +9551,7 @@ const _sfc_main$I = /* @__PURE__ */ vue.defineComponent({
       if (props2.field.$el === "toggle") return ToggleInput;
       if (props2.field.$el === "check") return CheckInput;
       if (props2.field.$el === "richtext") return _sfc_main$v;
-      if (props2.field.$el === "date") return _sfc_main$C;
+      if (props2.field.$el === "date") return _sfc_main$E;
       return props2.field.$el ?? "div";
     });
     const formData = vue.computed({
@@ -9635,7 +9635,7 @@ const _sfc_main$I = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
   __name: "BglForm",
   props: {
     label: {},
@@ -9733,7 +9733,7 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
             label: _ctx.label
           }, null, 8, ["label"])) : vue.createCommentVNode("", true),
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(computedSchema.value, (field, i2) => {
-            return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$I), {
+            return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$K), {
               key: field.id || `${i2}p`,
               modelValue: vue.unref(data2),
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(data2) ? data2.value = $event : data2 = $event),
@@ -9757,7 +9757,7 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
             label: _ctx.label
           }, null, 8, ["label"])) : vue.createCommentVNode("", true),
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(computedSchema.value, (field, i2) => {
-            return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$I), {
+            return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$K), {
               key: field.id || `${i2}p`,
               modelValue: vue.unref(data2),
               "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => vue.isRef(data2) ? data2.value = $event : data2 = $event),
@@ -9776,8 +9776,8 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$A = { key: 0 };
-const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$C = { key: 0 };
+const _sfc_main$I = /* @__PURE__ */ vue.defineComponent({
   __name: "BglMultiStepForm",
   props: /* @__PURE__ */ vue.mergeModels({
     bagelFormProps: { default: () => ({}) },
@@ -9844,8 +9844,8 @@ const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
           mode: "out-in"
         }, {
           default: vue.withCtx(() => [
-            !vue.unref(isStepping) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$A, [
-              vue.createVNode(vue.unref(_sfc_main$H), vue.mergeProps({
+            !vue.unref(isStepping) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$C, [
+              vue.createVNode(vue.unref(_sfc_main$J), vue.mergeProps({
                 ref_key: "formRef",
                 ref: formRef,
                 modelValue: formData.value,
@@ -9884,8 +9884,8 @@ const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$z = { class: "primary-checkbox" };
-const _sfc_main$F = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$B = { class: "primary-checkbox" };
+const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
   __name: "Checkbox",
   props: {
     "modelValue": { type: Boolean, ...{ default: false } },
@@ -9895,7 +9895,7 @@ const _sfc_main$F = /* @__PURE__ */ vue.defineComponent({
   setup(__props) {
     const val = vue.useModel(__props, "modelValue");
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("label", _hoisted_1$z, [
+      return vue.openBlock(), vue.createElementBlock("label", _hoisted_1$B, [
         vue.renderSlot(_ctx.$slots, "label", {}, void 0, true),
         vue.withDirectives(vue.createElementVNode("input", {
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => val.value = $event),
@@ -9907,11 +9907,11 @@ const _sfc_main$F = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-73f1d9ad"]]);
-const _hoisted_1$y = ["title"];
-const _hoisted_2$o = ["id", "value", "required"];
-const _hoisted_3$i = ["for"];
-const _sfc_main$E = /* @__PURE__ */ vue.defineComponent({
+const Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["__scopeId", "data-v-73f1d9ad"]]);
+const _hoisted_1$A = ["title"];
+const _hoisted_2$p = ["id", "value", "required"];
+const _hoisted_3$j = ["for"];
+const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
   __name: "CheckInput",
   props: /* @__PURE__ */ vue.mergeModels({
     label: {},
@@ -9945,22 +9945,22 @@ const _sfc_main$E = /* @__PURE__ */ vue.defineComponent({
           required: _ctx.required,
           type: "checkbox",
           class: "me-05"
-        }, null, 8, _hoisted_2$o), [
+        }, null, 8, _hoisted_2$p), [
           [vue.vModelCheckbox, checked.value]
         ]),
         vue.createElementVNode("label", { for: inputId.value }, [
           vue.renderSlot(_ctx.$slots, "label", {}, () => [
             vue.createTextVNode(vue.toDisplayString(_ctx.label), 1)
           ], true)
-        ], 8, _hoisted_3$i)
-      ], 10, _hoisted_1$y);
+        ], 8, _hoisted_3$j)
+      ], 10, _hoisted_1$A);
     };
   }
 });
-const CheckInput = /* @__PURE__ */ _export_sfc(_sfc_main$E, [["__scopeId", "data-v-1b4d18c6"]]);
-const _hoisted_1$x = ["title"];
-const _hoisted_2$n = ["id", "placeholder", "required"];
-const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
+const CheckInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-1b4d18c6"]]);
+const _hoisted_1$z = ["title"];
+const _hoisted_2$o = ["id", "placeholder", "required"];
+const _sfc_main$F = /* @__PURE__ */ vue.defineComponent({
   __name: "ColorPicker",
   props: {
     label: {},
@@ -9998,11 +9998,11 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
             placeholder: _ctx.placeholder || _ctx.label,
             class: { "no-edit": !_ctx.editMode },
             required: _ctx.required
-          }, _ctx.nativeInputAttrs), null, 16, _hoisted_2$n), [
+          }, _ctx.nativeInputAttrs), null, 16, _hoisted_2$o), [
             [vue.vModelText, inputVal.value]
           ])
         ])
-      ], 10, _hoisted_1$x)) : vue.createCommentVNode("", true);
+      ], 10, _hoisted_1$z)) : vue.createCommentVNode("", true);
     };
   }
 });
@@ -18445,9 +18445,9 @@ const eo = ({
 Object.entries(go).forEach(([e, t]) => {
   e !== "default" && (Hn[e] = t);
 });
-const _hoisted_1$w = ["title"];
-const _hoisted_2$m = { key: 0 };
-const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
+const _hoisted_1$y = ["title"];
+const _hoisted_2$n = { key: 0 };
+const _sfc_main$E = /* @__PURE__ */ vue.defineComponent({
   __name: "DateInput",
   props: {
     required: { type: Boolean },
@@ -18489,7 +18489,7 @@ const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
         class: vue.normalizeClass(["bagel-input", { small: _ctx.small }]),
         title: _ctx.label
       }, [
-        _ctx.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$m, vue.toDisplayString(_ctx.label), 1)) : vue.createCommentVNode("", true),
+        _ctx.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$n, vue.toDisplayString(_ctx.label), 1)) : vue.createCommentVNode("", true),
         vue.createVNode(vue.unref(Hn), vue.mergeProps({
           ref_key: "datePicker",
           ref: datePicker,
@@ -18505,19 +18505,19 @@ const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
           "minutes-grid-increment": _ctx.minutesGridIncrement,
           "start-time": { hours: 8, minutes: 0 }
         }), null, 16, ["modelValue", "required", "enable-time-picker", "allowed-dates", "time-picker-inline", "minutes-increment", "minutes-grid-increment"])
-      ], 10, _hoisted_1$w);
+      ], 10, _hoisted_1$y);
     };
   }
 });
-const _hoisted_1$v = { class: "datetime-wrap" };
-const _hoisted_2$l = { class: "date-wrap" };
-const _hoisted_3$h = {
+const _hoisted_1$x = { class: "datetime-wrap" };
+const _hoisted_2$m = { class: "date-wrap" };
+const _hoisted_3$i = {
   key: 0,
   class: "time-wrap"
 };
-const _hoisted_4$c = ["id", "name", "value"];
+const _hoisted_4$d = ["id", "name", "value"];
 const _hoisted_5$b = ["for"];
-const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
   __name: "DatePicker",
   props: {
     label: {},
@@ -18545,8 +18545,8 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
       return `${hour}:${minute}`;
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$v, [
-        vue.createElementVNode("div", _hoisted_2$l, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$x, [
+        vue.createElementVNode("div", _hoisted_2$m, [
           vue.createVNode(vue.unref(Hn), vue.mergeProps({
             modelValue: selectedDate.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectedDate.value = $event),
@@ -18564,7 +18564,7 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
             _: 1
           }, 16, ["modelValue", "allowed-dates", "disabled-dates"])
         ]),
-        _ctx.showTimeWrap ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$h, [
+        _ctx.showTimeWrap ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$i, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(hours), (hr2) => {
             return vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: hr2 }, [
               vue.withDirectives(vue.createElementVNode("input", {
@@ -18573,7 +18573,7 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
                 type: "radio",
                 name: _ctx.label,
                 value: hr2
-              }, null, 8, _hoisted_4$c), [
+              }, null, 8, _hoisted_4$d), [
                 [vue.vModelRadio, selectedHour.value]
               ]),
               vue.createElementVNode("label", {
@@ -18586,13 +18586,13 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$u = { class: "bagel-input" };
-const _hoisted_2$k = {
+const _hoisted_1$w = { class: "bagel-input" };
+const _hoisted_2$l = {
   key: 0,
   class: "bgl-multi-preview"
 };
-const _hoisted_3$g = ["src"];
-const _hoisted_4$b = { class: "m-0" };
+const _hoisted_3$h = ["src"];
+const _hoisted_4$c = { class: "m-0" };
 const _hoisted_5$a = ["width", "src"];
 const _hoisted_6$8 = { class: "no-margin multi-preview-txt" };
 const _hoisted_7$5 = {
@@ -18610,7 +18610,7 @@ const _hoisted_10$2 = {
 };
 const _hoisted_11$1 = ["src"];
 const _hoisted_12 = { class: "p-1 flex column hover fileUploadPlaceHolder justify-content-center mb-05" };
-const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
   __name: "FileUpload",
   props: {
     label: {},
@@ -18759,7 +18759,7 @@ const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
     }
     return (_ctx, _cache) => {
       const _directive_lightbox = vue.resolveDirective("lightbox");
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$u, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$w, [
         vue.createElementVNode("label", null, vue.toDisplayString(_ctx.label), 1),
         vue.createElementVNode("div", {
           class: vue.normalizeClass(["fileUploadWrap", {
@@ -18777,7 +18777,7 @@ const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
             files: storageFiles.value,
             fileQueue: fileQueue.value
           }, () => [
-            _ctx.multiple ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$k, [
+            _ctx.multiple ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$l, [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(storageFiles.value, (file) => {
                 return vue.openBlock(), vue.createElementBlock("div", {
                   key: file.id,
@@ -18788,14 +18788,14 @@ const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
                     class: "multi-preview",
                     src: file.url,
                     alt: ""
-                  }, null, 8, _hoisted_3$g)), [
+                  }, null, 8, _hoisted_3$h)), [
                     [_directive_lightbox]
                   ]) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
                     key: 1,
                     icon: "draft",
                     class: "multi-preview"
                   })),
-                  vue.createElementVNode("p", _hoisted_4$b, vue.toDisplayString(file.name), 1),
+                  vue.createElementVNode("p", _hoisted_4$c, vue.toDisplayString(file.name), 1),
                   vue.createVNode(vue.unref(Btn), {
                     thin: "",
                     flat: "",
@@ -18900,11 +18900,11 @@ const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const $el = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["__scopeId", "data-v-be593d04"]]);
-const _hoisted_1$t = ["title"];
-const _hoisted_2$j = { key: 0 };
-const _hoisted_3$f = ["value", "placeholder"];
-const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
+const $el = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["__scopeId", "data-v-be593d04"]]);
+const _hoisted_1$v = ["title"];
+const _hoisted_2$k = { key: 0 };
+const _hoisted_3$g = ["value", "placeholder"];
+const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
   __name: "JSONInput",
   props: {
     description: { default: "" },
@@ -18927,7 +18927,7 @@ const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
         class: vue.normalizeClass(["bagel-input", { small: _ctx.small }]),
         title: _ctx.description
       }, [
-        _ctx.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$j, [
+        _ctx.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$k, [
           vue.createVNode(_component_LangText, { input: _ctx.label }, null, 8, ["input"])
         ])) : vue.createCommentVNode("", true),
         vue.createElementVNode("textarea", {
@@ -18935,14 +18935,120 @@ const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
           class: vue.normalizeClass({ "no-edit": !_ctx.editMode }),
           placeholder: _ctx.placeholder,
           onInput: handleInput
-        }, null, 42, _hoisted_3$f)
-      ], 10, _hoisted_1$t);
+        }, null, 42, _hoisted_3$g)
+      ], 10, _hoisted_1$v);
     };
   }
 });
-const JSONInput = /* @__PURE__ */ _export_sfc(_sfc_main$z, [["__scopeId", "data-v-1cbaeab2"]]);
-const _hoisted_1$s = { class: "relative" };
-const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
+const JSONInput = /* @__PURE__ */ _export_sfc(_sfc_main$B, [["__scopeId", "data-v-1cbaeab2"]]);
+const _hoisted_1$u = ["value", "autofocus", "onKeydown", "onPaste"];
+const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
+  __name: "OTP",
+  props: {
+    digitCount: {},
+    default: {},
+    modelValue: {}
+  },
+  emits: ["update:modelValue", "complete"],
+  setup(__props, { emit: __emit }) {
+    const props2 = __props;
+    const emit2 = __emit;
+    const digits = vue.reactive([]);
+    const otpCont = vue.ref();
+    function handlePaste2(event, index2) {
+      event.preventDefault();
+      const { clipboardData } = event;
+      const pastedText = clipboardData == null ? void 0 : clipboardData.getData("text").replace(/\D/g, "");
+      const pastedDigits = pastedText == null ? void 0 : pastedText.split("");
+      if (!pastedDigits) return;
+      for (let i2 = 0; i2 < pastedDigits.length; i2++) {
+        const digit = pastedDigits[i2];
+        if (index2 + i2 < digits.length) {
+          digits[index2 + i2] = digit;
+        }
+      }
+      emitUpdate();
+    }
+    function emitUpdate() {
+      if (isDigitsFull()) {
+        emit2("complete", digits.join(""));
+      } else {
+        emit2("update:modelValue", digits.join(""));
+      }
+    }
+    function handleKeyDown2(event, index2) {
+      var _a2;
+      const noPreventKeys = ["Tab", "ArrowRight", "ArrowLeft", "Control", "Shift", "Alt", "Meta"];
+      if (noPreventKeys.includes(event.key)) {
+        return;
+      }
+      if (event.key === "Backspace") {
+        digits[index2] = null;
+        if (index2 !== 0) {
+          const prevDigit = (_a2 = otpCont.value) == null ? void 0 : _a2.children[index2 - 1];
+          prevDigit.focus();
+        }
+        emitUpdate();
+        return;
+      }
+      const numberRegex = /^\d$/;
+      if (numberRegex.test(event.key)) {
+        digits[index2] = event.key;
+        if (index2 !== props2.digitCount - 1) {
+          setTimeout(() => {
+            var _a3;
+            const nextDigit = (_a3 = otpCont.value) == null ? void 0 : _a3.children[index2 + 1];
+            nextDigit.focus();
+          }, 10);
+        }
+        emitUpdate();
+      }
+    }
+    if (props2.default && props2.default.length === props2.digitCount) {
+      for (let i2 = 0; i2 < props2.digitCount; i2++) {
+        digits[i2] = props2.default.charAt(i2);
+      }
+    } else {
+      for (let i2 = 0; i2 < props2.digitCount; i2++) {
+        digits[i2] = null;
+      }
+    }
+    function isDigitsFull() {
+      for (const elem of digits) {
+        if (elem == null || elem == void 0) {
+          return false;
+        }
+      }
+      return true;
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        ref_key: "otpCont",
+        ref: otpCont,
+        class: "otp_wrap"
+      }, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(digits, (el, ind) => {
+          return vue.openBlock(), vue.createElementBlock("input", {
+            key: ind,
+            value: digits[ind] || "",
+            type: "number",
+            inputmode: "numeric",
+            class: "digit-box",
+            autofocus: ind === 0,
+            maxlength: "1",
+            pattern: "[0-9]*",
+            oninput: "this.value = this.value.slice(0, 1);",
+            onKeydown: ($event) => handleKeyDown2($event, ind),
+            onPaste: ($event) => handlePaste2($event, ind)
+          }, null, 40, _hoisted_1$u);
+        }), 128))
+      ], 512);
+    };
+  }
+});
+const OTP = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["__scopeId", "data-v-539a9fdb"]]);
+const _hoisted_1$t = { class: "relative" };
+const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
   __name: "PasswordInput",
   props: /* @__PURE__ */ vue.mergeModels({
     id: {},
@@ -18982,7 +19088,7 @@ const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
     );
     const inputType = vue.computed(() => showPwd.value ? "text" : "password");
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$s, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$t, [
         vue.createVNode(vue.unref(TextInput), vue.mergeProps({
           modelValue: password.value,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => password.value = $event)
@@ -19002,10 +19108,10 @@ const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _hoisted_1$r = ["for"];
-const _hoisted_2$i = ["id", "name", "value"];
-const _hoisted_3$e = { class: "flex w-100 gap-1 flex-wrap m_gap-05 m_gap-row-025" };
-const _hoisted_4$a = ["src", "alt"];
+const _hoisted_1$s = ["for"];
+const _hoisted_2$j = ["id", "name", "value"];
+const _hoisted_3$f = { class: "flex w-100 gap-1 flex-wrap m_gap-05 m_gap-row-025" };
+const _hoisted_4$b = ["src", "alt"];
 const _hoisted_5$9 = { class: "" };
 const _hoisted_6$7 = {
   key: 0,
@@ -19015,7 +19121,7 @@ const _hoisted_7$4 = {
   key: 1,
   class: "txt-gray txt-12 m-0"
 };
-const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
   __name: "RadioGroup",
   props: /* @__PURE__ */ vue.mergeModels({
     groupName: {},
@@ -19043,17 +19149,17 @@ const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
               type: "radio",
               name: _ctx.groupName,
               value: opt.value
-            }, null, 8, _hoisted_2$i), [
+            }, null, 8, _hoisted_2$j), [
               [vue.vModelRadio, selectedOption.value]
             ]),
-            vue.createElementVNode("div", _hoisted_3$e, [
+            vue.createElementVNode("div", _hoisted_3$f, [
               opt.imgSrc ? (vue.openBlock(), vue.createElementBlock("img", {
                 key: 0,
                 class: "bg-popup shadow-light py-025 radius-05 m_w40",
                 width: "60",
                 src: opt.imgSrc,
                 alt: opt.imgAlt
-              }, null, 8, _hoisted_4$a)) : vue.createCommentVNode("", true),
+              }, null, 8, _hoisted_4$b)) : vue.createCommentVNode("", true),
               vue.createElementVNode("div", _hoisted_5$9, [
                 opt.label ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_6$7, vue.toDisplayString(opt.label), 1)) : vue.createCommentVNode("", true),
                 opt.subLabel ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_7$4, vue.toDisplayString(opt.subLabel), 1)) : vue.createCommentVNode("", true)
@@ -19068,19 +19174,19 @@ const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
               icon: "delete",
               onClick: ($event) => _ctx.$emit("delete", opt)
             }, null, 8, ["onClick"])) : vue.createCommentVNode("", true)
-          ], 8, _hoisted_1$r);
+          ], 8, _hoisted_1$s);
         }), 128))
       ]);
     };
   }
 });
-const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["__scopeId", "data-v-3e9e030f"]]);
-const _hoisted_1$q = { class: "bagel-input" };
-const _hoisted_2$h = { class: "pb-025" };
-const _hoisted_3$d = { class: "flex gap-05 flex-wrap" };
-const _hoisted_4$9 = ["id", "name", "value", "checked"];
+const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$y, [["__scopeId", "data-v-3e9e030f"]]);
+const _hoisted_1$r = { class: "bagel-input" };
+const _hoisted_2$i = { class: "pb-025" };
+const _hoisted_3$e = { class: "flex gap-05 flex-wrap" };
+const _hoisted_4$a = ["id", "name", "value", "checked"];
 const _hoisted_5$8 = ["for"];
-const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
   __name: "RadioPillsInput",
   props: {
     options: {},
@@ -19121,9 +19227,9 @@ const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
       selectedValue.value = props2.modelValue;
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
-        vue.createElementVNode("label", _hoisted_2$h, vue.toDisplayString(_ctx.label), 1),
-        vue.createElementVNode("div", _hoisted_3$d, [
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$r, [
+        vue.createElementVNode("label", _hoisted_2$i, vue.toDisplayString(_ctx.label), 1),
+        vue.createElementVNode("div", _hoisted_3$e, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options, (option2, index2) => {
             return vue.openBlock(), vue.createElementBlock("div", {
               key: index2,
@@ -19136,7 +19242,7 @@ const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
                 value: getValue(option2),
                 checked: vue.unref(selectedValue) === getValue(option2),
                 onChange: handleSelect
-              }, null, 40, _hoisted_4$9),
+              }, null, 40, _hoisted_4$a),
               vue.createElementVNode("label", {
                 for: `${_ctx.id}-${getValue(option2)}`
               }, vue.toDisplayString(getLabel(option2)), 9, _hoisted_5$8)
@@ -19147,7 +19253,49 @@ const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const RadioPillsInput = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["__scopeId", "data-v-f2912ed8"]]);
+const RadioPillsInput = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["__scopeId", "data-v-f2912ed8"]]);
+const _hoisted_1$q = { class: "flex gap-1 align-center range-slide" };
+const _hoisted_2$h = { key: 0 };
+const _hoisted_3$d = ["max", "min", "step"];
+const _hoisted_4$9 = { key: 1 };
+const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
+  __name: "RangeInput",
+  props: /* @__PURE__ */ vue.mergeModels({
+    min: {},
+    max: {},
+    step: {}
+  }, {
+    "modelValue": { default: 0 },
+    "modelModifiers": {}
+  }),
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const val = vue.useModel(__props, "modelValue");
+    const background = vue.computed(() => {
+      const minVal = __props.min ?? 0;
+      const maxVal = __props.max ?? 100;
+      const percentage = (val.value - minVal) / (maxVal - minVal) * 100;
+      return `linear-gradient(to right, var(--bgl-primary) ${percentage}%, var(--input-bg) ${percentage}%)`;
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
+        _ctx.min !== void 0 ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_2$h, vue.toDisplayString(_ctx.min), 1)) : vue.createCommentVNode("", true),
+        vue.withDirectives(vue.createElementVNode("input", {
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => val.value = $event),
+          style: vue.normalizeStyle({ background: background.value }),
+          max: _ctx.max,
+          min: _ctx.min,
+          step: _ctx.step,
+          type: "range"
+        }, null, 12, _hoisted_3$d), [
+          [vue.vModelText, val.value]
+        ]),
+        _ctx.max !== void 0 ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_4$9, vue.toDisplayString(_ctx.max), 1)) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const RangeInput = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["__scopeId", "data-v-d653c76a"]]);
 function OrderedMap(content) {
   this.content = content;
 }
@@ -43539,7 +43687,7 @@ const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
       }
     });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$K), {
+      return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$M), {
         ref_key: "dropdown",
         ref: dropdown,
         placement: "bottom-start",
@@ -43591,7 +43739,7 @@ const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
           ])
         ]),
         default: vue.withCtx(() => [
-          vue.createVNode(vue.unref(_sfc_main$O), {
+          vue.createVNode(vue.unref(_sfc_main$Q), {
             class: "p-05",
             style: vue.normalizeStyle({ width: _ctx.fullWidth ? "100%" : "auto" })
           }, {
@@ -52000,7 +52148,7 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
               vue.withKeys(reset, ["tab"])
             ]
           }, [
-            !computedDropDownOptions.value.hide ? (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$K), {
+            !computedDropDownOptions.value.hide ? (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$M), {
               key: 0,
               ref_key: "phoneDropdown",
               ref: phoneDropdown,
@@ -52234,7 +52382,7 @@ const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-739e3acb"]]);
+const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-194260fc"]]);
 const _hoisted_1$h = ["title"];
 const _hoisted_2$9 = ["id", "required"];
 const _hoisted_3$7 = ["for"];
@@ -52295,7 +52443,7 @@ const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$O), { class: "hide m_grid gap-05 bgl_bottombar px-1 txt14 justify-content-start align-items-center overflow-x" }, {
+      return vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$Q), { class: "hide m_grid gap-05 bgl_bottombar px-1 txt14 justify-content-start align-items-center overflow-x" }, {
         default: vue.withCtx(() => [
           vue.renderSlot(_ctx.$slots, "brand", {}, void 0, true),
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.navLinks, (nav2, i2) => {
@@ -52395,7 +52543,7 @@ const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
           icon: "keyboard_arrow_right",
           onClick: toggleMenu
         }),
-        vue.createVNode(vue.unref(_sfc_main$O), { class: "py-1 px-05 h-100 flex column gap-05 rounded relative bg-primary font-light overflow-y" }, {
+        vue.createVNode(vue.unref(_sfc_main$Q), { class: "py-1 px-05 h-100 flex column gap-05 rounded relative bg-primary font-light overflow-y" }, {
           default: vue.withCtx(() => [
             !vue.unref(isOpen) || !vue.unref(slots)["brand-open"] ? vue.renderSlot(_ctx.$slots, "brand", { key: 0 }, void 0, true) : vue.createCommentVNode("", true),
             vue.unref(isOpen) ? vue.renderSlot(_ctx.$slots, "brand-open", { key: 1 }, void 0, true) : vue.createCommentVNode("", true),
@@ -52902,7 +53050,7 @@ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
         onClick: _cache[1] || (_cache[1] = () => _ctx.dismissable ? closeModal() : ""),
         onKeydown: vue.withKeys(closeModal, ["esc"])
       }, [
-        vue.createVNode(vue.unref(_sfc_main$O), {
+        vue.createVNode(vue.unref(_sfc_main$Q), {
           class: "modal",
           style: vue.normalizeStyle({ ...maxWidth.value }),
           onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
@@ -53070,7 +53218,7 @@ const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
         "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => emit2("update:visible", $event))
       }, vue.createSlots({
         default: vue.withCtx(() => [
-          vue.createVNode(vue.unref(_sfc_main$H), {
+          vue.createVNode(vue.unref(_sfc_main$J), {
             ref_key: "form",
             ref: form,
             modelValue: formData.value,
@@ -53920,7 +54068,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
                         row,
                         field
                       }, void 0, true) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$1, [
-                        vue.createVNode(vue.unref(_sfc_main$I), {
+                        vue.createVNode(vue.unref(_sfc_main$K), {
                           class: "embedded-field",
                           field,
                           modelValue: row,
@@ -55071,7 +55219,7 @@ function frmRow(...children2) {
 function bglForm(idOrField, ...schema) {
   if (typeof idOrField === "string") {
     return {
-      $el: vue.markRaw(_sfc_main$H),
+      $el: vue.markRaw(_sfc_main$J),
       id: idOrField,
       attrs: {
         schema: [idOrField, ...schema]
@@ -55079,7 +55227,7 @@ function bglForm(idOrField, ...schema) {
     };
   }
   return {
-    $el: vue.markRaw(_sfc_main$H),
+    $el: vue.markRaw(_sfc_main$J),
     attrs: {
       schema: [idOrField, ...schema]
     }
@@ -55680,29 +55828,29 @@ const IMAGE_FORMATS = ["jpeg", "png", "webp", "avif", "apng", "gif", "avifs", "s
 const IMAGE_FORMATS_REGEXP = new RegExp(`(${IMAGE_FORMATS.join("|")})$`, "i");
 const VIDEO_FORMATS = ["mp4", "webm", "ogg", "mov", "avi", "flv", "wmv", "mkv", "ts", "m3u8"];
 const VIDEO_FORMATS_REGEXP = new RegExp(`(${VIDEO_FORMATS.join("|")})$`, "i");
-exports.Accordion = _sfc_main$W;
+exports.Accordion = _sfc_main$Y;
 exports.AccordionItem = AccordionItem;
-exports.AddressSearch = _sfc_main$U;
+exports.AddressSearch = _sfc_main$W;
 exports.Alert = Alert;
 exports.Avatar = Avatar;
 exports.Badge = Badge;
-exports.BagelForm = _sfc_main$H;
+exports.BagelForm = _sfc_main$J;
 exports.BagelVue = BagelVue;
-exports.BglField = _sfc_main$I;
-exports.BglForm = _sfc_main$H;
-exports.BglMultiStepForm = _sfc_main$G;
+exports.BglField = _sfc_main$K;
+exports.BglForm = _sfc_main$J;
+exports.BglMultiStepForm = _sfc_main$I;
 exports.BglVideo = BglVideo;
 exports.BottomMenu = BottomMenu;
 exports.Btn = Btn;
-exports.Card = _sfc_main$O;
+exports.Card = _sfc_main$Q;
 exports.Carousel = Carousel;
 exports.CheckInput = CheckInput;
 exports.Checkbox = Checkbox;
-exports.ColorPicker = _sfc_main$D;
+exports.ColorPicker = _sfc_main$F;
 exports.DataPreview = DataPreview;
-exports.DateInput = _sfc_main$C;
-exports.DatePicker = _sfc_main$B;
-exports.Dropdown = _sfc_main$K;
+exports.DateInput = _sfc_main$E;
+exports.DatePicker = _sfc_main$D;
+exports.Dropdown = _sfc_main$M;
 exports.FileUpload = $el;
 exports.Flag = Flag;
 exports.IMAGE_FORMATS = IMAGE_FORMATS;
@@ -55710,7 +55858,7 @@ exports.IMAGE_FORMATS_REGEXP = IMAGE_FORMATS_REGEXP;
 exports.Icon = _sfc_main$c;
 exports.JSONInput = JSONInput;
 exports.Layout = Layout;
-exports.Lineart = _sfc_main$M;
+exports.Lineart = _sfc_main$O;
 exports.ListItem = _sfc_main$f;
 exports.ListView = ListView;
 exports.MapEmbed = _sfc_main$d;
@@ -55720,11 +55868,13 @@ exports.ModalConfirm = _sfc_main$a;
 exports.ModalForm = ModalForm;
 exports.ModalPlugin = ModalPlugin;
 exports.NavBar = NavBar;
+exports.OTP = OTP;
 exports.PageTitle = _sfc_main$7;
-exports.PasswordInput = _sfc_main$y;
+exports.PasswordInput = _sfc_main$z;
 exports.Pill = Pill;
 exports.RadioGroup = RadioGroup;
 exports.RadioPillsInput = RadioPillsInput;
+exports.RangeInput = RangeInput;
 exports.RichText = _sfc_main$v;
 exports.RichText2 = index$1;
 exports.RouterWrapper = RouterWrapper;