@bagelink/vue 0.0.260 → 0.0.262

package/dist/index.mjs

@@ -14619,7 +14619,7 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$F = { class: "full-nav" };
 const _hoisted_2$z = { class: "nav-scroll" };
-const _hoisted_3$p = { class: "nav-links-wrapper" };
+const _hoisted_3$q = { class: "nav-links-wrapper" };
 const _hoisted_4$j = { class: "tooltip" };
 const _hoisted_5$g = { class: "bot-buttons-wrapper" };
 const _hoisted_6$b = { class: "tooltip" };
@@ -14654,7 +14654,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
         ], 32),
         createElementVNode("div", _hoisted_1$F, [
           createElementVNode("div", _hoisted_2$z, [
-            createElementVNode("div", _hoisted_3$p, [
+            createElementVNode("div", _hoisted_3$q, [
               (openBlock(true), createElementBlock(Fragment$1, null, renderList(_ctx.links, (link) => {
                 return openBlock(), createBlock(resolveDynamicComponent(link.to ? "router-link" : "div"), {
                   class: "nav-button",
@@ -14909,13 +14909,15 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     schema: { type: Function },
     onSubmit: { type: Function },
     onDelete: { type: Function },
-    "onUpdate:isModalVisible": { type: Function }
+    "onUpdate:isModalVisible": { type: Function },
+    onError: { type: Function }
   }, {
     "modelValue": { default: {} },
     "modelModifiers": {}
   }),
   emits: ["update:modelValue"],
   setup(__props) {
+    const bagel = useBagel();
     const props2 = __props;
     const modal = ref();
     const computedFormSchema = computed(() => {
@@ -14930,14 +14932,17 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
       return (_a2 = modal.value) == null ? void 0 : _a2.closeModal();
     };
     const runSubmit = async () => {
-      var _a2, _b, _c;
+      var _a2, _b, _c, _d;
       if (((_b = (_a2 = form.value) == null ? void 0 : _a2.validateForm) == null ? void 0 : _b.call(_a2)) === false)
         return;
       try {
         await ((_c = props2.onSubmit) == null ? void 0 : _c.call(props2, formData.value));
         closeModal();
       } catch (err) {
-        console.error(err);
+        if (props2.onError)
+          props2.onError(err);
+        else
+          (_d = bagel == null ? void 0 : bagel.onError) == null ? void 0 : _d.call(bagel, err);
       }
     };
     const runDelete = () => {
@@ -14996,7 +15001,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ModalForm = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["__scopeId", "data-v-753a1016"]]);
+const ModalForm = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["__scopeId", "data-v-82698669"]]);
 const _hoisted_1$C = { class: "accordion-item" };
 const _hoisted_2$w = {
   key: 0,
@@ -15041,7 +15046,7 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
 const AccordionItem = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["__scopeId", "data-v-172f43f1"]]);
 const _hoisted_1$B = { class: "card list-view grid thin" };
 const _hoisted_2$v = { class: "list-header flex gap-3 align-items-top" };
-const _hoisted_3$o = {
+const _hoisted_3$p = {
   key: 0,
   class: "bagel-input search-wrap"
 };
@@ -15065,7 +15070,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$B, [
         createElementVNode("div", _hoisted_2$v, [
-          _ctx.enableSearch ? (openBlock(), createElementBlock("div", _hoisted_3$o, [
+          _ctx.enableSearch ? (openBlock(), createElementBlock("div", _hoisted_3$p, [
             withDirectives(createElementVNode("input", {
               placeholder: _ctx.searchPlaceholder,
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchTerm.value = $event),
@@ -15134,7 +15139,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$z = { class: "card tabs-top" };
 const _hoisted_2$t = { class: "tabs grid auto-flow-columns fit-content" };
-const _hoisted_3$n = ["onClick"];
+const _hoisted_3$o = ["onClick"];
 const _sfc_main$t = /* @__PURE__ */ defineComponent({
   __name: "TabbedLayout",
   props: {
@@ -15181,7 +15186,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
                 }, "tab"]),
                 key: tab,
                 onClick: ($event) => changeTab(tab)
-              }, toDisplayString(tab), 11, _hoisted_3$n);
+              }, toDisplayString(tab), 11, _hoisted_3$o);
             }), 128))
           ])
         ]),
@@ -15200,7 +15205,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
 const TabbedLayout = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-09fce741"]]);
 const _hoisted_1$y = { class: "comments-wrap" };
 const _hoisted_2$s = { class: "comment-list" };
-const _hoisted_3$m = { class: "comment-top" };
+const _hoisted_3$n = { class: "comment-top" };
 const _hoisted_4$h = { class: "comment-owner" };
 const _hoisted_5$e = { class: "comment-time" };
 const _hoisted_6$a = { class: "comment-actions" };
@@ -15260,7 +15265,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
               }, "comment"]),
               key: comment.id
             }, [
-              createElementVNode("div", _hoisted_3$m, [
+              createElementVNode("div", _hoisted_3$n, [
                 createElementVNode("div", _hoisted_4$h, toDisplayString(comment.sender.first_name) + " " + toDisplayString(comment.sender.last_name), 1),
                 createElementVNode("div", _hoisted_5$e, toDisplayString(comment.updated_at.split("T")[0]), 1),
                 createElementVNode("div", _hoisted_6$a, [
@@ -15342,7 +15347,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$w = { class: "table-list-wrap h-100" };
 const _hoisted_2$q = { class: "infinite-wrapper" };
-const _hoisted_3$l = { class: "row first-row" };
+const _hoisted_3$m = { class: "row first-row" };
 const _hoisted_4$g = ["onClick"];
 const _hoisted_5$d = { class: "flex" };
 const _hoisted_6$9 = ["onClick"];
@@ -15383,7 +15388,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$w, [
         createElementVNode("table", _hoisted_2$q, [
-          createElementVNode("thead", _hoisted_3$l, [
+          createElementVNode("thead", _hoisted_3$m, [
             (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedSchema.value, (field) => {
               return openBlock(), createElementBlock("th", {
                 class: "col",
@@ -15439,7 +15444,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-555ad739"]]);
+const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-2137a7a8"]]);
 const _sfc_main$p = {};
 const _hoisted_1$v = { class: "flex space-between" };
 function _sfc_render$1(_ctx, _cache) {
@@ -15479,7 +15484,7 @@ const _hoisted_2$p = {
   key: 0,
   class: "data-row"
 };
-const _hoisted_3$k = { class: "key" };
+const _hoisted_3$l = { class: "key" };
 const _hoisted_4$f = { key: 1 };
 const _hoisted_5$c = { class: "key" };
 const _hoisted_6$8 = { class: "vlue" };
@@ -15507,7 +15512,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
             key: field.id
           }, [
             unref(iffer)(field, itemData.value) ? (openBlock(), createElementBlock("div", _hoisted_2$p, [
-              createElementVNode("div", _hoisted_3$k, toDisplayString((field == null ? void 0 : field.label) || unref(keyToLabel)(field.id)), 1),
+              createElementVNode("div", _hoisted_3$l, toDisplayString((field == null ? void 0 : field.label) || unref(keyToLabel)(field.id)), 1),
               createVNode(unref(_sfc_main$h), {
                 field,
                 modelValue: itemData.value,
@@ -15613,7 +15618,7 @@ const _hoisted_2$o = {
   key: 0,
   class: "group-wrap"
 };
-const _hoisted_3$j = { class: "group-title" };
+const _hoisted_3$k = { class: "group-title" };
 const _hoisted_4$e = {
   key: 1,
   class: "bar-wrap"
@@ -15681,7 +15686,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
             key: i2
           }, [
             item.group ? (openBlock(), createElementBlock("div", _hoisted_2$o, [
-              createElementVNode("p", _hoisted_3$j, toDisplayString(item.group), 1),
+              createElementVNode("p", _hoisted_3$k, toDisplayString(item.group), 1),
               (openBlock(true), createElementBlock(Fragment$1, null, renderList((item == null ? void 0 : item.data) || [], (nested, i22) => {
                 return openBlock(), createElementBlock("div", {
                   key: i22,
@@ -15919,7 +15924,7 @@ const _hoisted_2$n = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ create
 }, [
   /* @__PURE__ */ createElementVNode("path", { d: "M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z" })
 ], -1));
-const _hoisted_3$i = [
+const _hoisted_3$j = [
   _hoisted_2$n
 ];
 const _hoisted_4$d = ["id"];
@@ -15945,7 +15950,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
         createElementVNode("div", {
           class: normalizeClass(["check-square", { checked: checked.value }]),
           onClick: _cache[0] || (_cache[0] = ($event) => checked.value = !checked.value)
-        }, _hoisted_3$i, 2),
+        }, _hoisted_3$j, 2),
         createElementVNode("label", null, [
           withDirectives(createElementVNode("input", {
             id: _ctx.id,
@@ -24622,7 +24627,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$p = ["title"];
 const _hoisted_2$l = { key: 0 };
-const _hoisted_3$h = ["value", "placeholder"];
+const _hoisted_3$i = ["value", "placeholder"];
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   __name: "JSONInput",
   props: {
@@ -24654,7 +24659,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           onInput: handleInput,
           class: normalizeClass({ "no-edit": !_ctx.editMode }),
           placeholder: _ctx.placeholder
-        }, null, 42, _hoisted_3$h)
+        }, null, 42, _hoisted_3$i)
       ], 10, _hoisted_1$p);
     };
   }
@@ -25652,7 +25657,7 @@ const _hoisted_1$o = {
   class: "multiselect__tags"
 };
 const _hoisted_2$k = { class: "multiselect__tags-wrap" };
-const _hoisted_3$g = { class: "multiselect__spinner" };
+const _hoisted_3$h = { class: "multiselect__spinner" };
 const _hoisted_4$c = { key: 0 };
 const _hoisted_5$a = { class: "multiselect__option" };
 const _hoisted_6$6 = { class: "multiselect__option" };
@@ -25747,7 +25752,7 @@ function render$e(_ctx, _cache, $props, $setup, $data, $options) {
             renderSlot(_ctx.$slots, "loading", {}, () => [
               withDirectives(createVNode(
                 "div",
-                _hoisted_3$g,
+                _hoisted_3$h,
                 null,
                 512
                 /* NEED_PATCH */
@@ -25967,6 +25972,7 @@ script$e.render = render$e;
 const Multiselect = script$e;
 const _hoisted_1$n = { class: "pb-1" };
 const _hoisted_2$j = ["for"];
+const _hoisted_3$g = ["name", "required"];
 const _sfc_main$d = /* @__PURE__ */ defineComponent({
   __name: "SelectInput",
   props: {
@@ -25976,7 +25982,8 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
     modelValue: {},
     placeholder: {},
     defaultValue: {},
-    options: {}
+    options: {},
+    extraProps: {}
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -26015,7 +26022,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
           for: _ctx.id
         }, [
           createTextVNode(toDisplayString(_ctx.label) + " ", 1),
-          createVNode(unref(Multiselect), {
+          createVNode(unref(Multiselect), mergeProps({
             ref_key: "multiselect",
             ref: multiselect,
             id: _ctx.id,
@@ -26026,7 +26033,15 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
             placeholder: _ctx.placeholder,
             modelValue: seletValue.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => seletValue.value = $event)
-          }, null, 8, ["id", "options", "required", "placeholder", "modelValue"])
+          }, _ctx.extraProps), null, 16, ["id", "options", "required", "placeholder", "modelValue"]),
+          withDirectives(createElementVNode("input", mergeProps({
+            "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => seletValue.value = $event),
+            type: "hidden",
+            name: _ctx.id,
+            required: _ctx.required
+          }, _ctx.extraProps), null, 16, _hoisted_3$g), [
+            [vModelText, seletValue.value]
+          ])
         ], 8, _hoisted_2$j)
       ]);
     };
@@ -28828,7 +28843,16 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     );
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["bagel-input text-input", { dense: _ctx.dense, small: _ctx.small, shrink: _ctx.shrink, toggleEdit: _ctx.toggleEdit, editMode: unref(editMode), textInputIconWrap: _ctx.icon, txtInputIconStart: _ctx.iconStart, code: _ctx.code }]),
+        class: normalizeClass(["bagel-input text-input", {
+          dense: _ctx.dense,
+          small: _ctx.small,
+          shrink: _ctx.shrink,
+          toggleEdit: _ctx.toggleEdit,
+          editMode: unref(editMode),
+          code: _ctx.code,
+          textInputIconWrap: _ctx.icon,
+          txtInputIconStart: _ctx.iconStart
+        }]),
         title: _ctx.title
       }, [
         createElementVNode("label", { for: _ctx.id }, [
@@ -28888,14 +28912,14 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-8c868409"]]);
+const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-e116816b"]]);
 const _hoisted_1$j = ["title"];
 const _hoisted_2$f = { key: 0 };
 const _hoisted_3$c = {
   key: 1,
   class: "character-limit"
 };
-const _hoisted_4$9 = ["value"];
+const _hoisted_4$9 = ["value", "required"];
 const _sfc_main$9 = /* @__PURE__ */ defineComponent({
   __name: "TextArea",
   props: {
@@ -28906,7 +28930,8 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     editMode: { type: Boolean, default: true },
     small: { type: Boolean },
     nativeInputAttrs: {},
-    showCharacterLimit: { type: Boolean }
+    showCharacterLimit: { type: Boolean },
+    required: { type: Boolean }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -28929,12 +28954,12 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
           value: _ctx.modelValue,
           onInput: handleInput,
           class: { "no-edit": !_ctx.editMode }
-        }, _ctx.nativeInputAttrs), null, 16, _hoisted_4$9)
+        }, _ctx.nativeInputAttrs, { required: _ctx.required }), null, 16, _hoisted_4$9)
       ], 10, _hoisted_1$j);
     };
   }
 });
-const TextArea = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-a5b28c58"]]);
+const TextArea = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-64dc9f53"]]);
 const _hoisted_1$i = { class: "primary-checkbox" };
 const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   __name: "Checkbox",

package/dist/plugins/modal.d.ts

@@ -16,6 +16,7 @@ interface ModalFormOptions {
     modelValue?: Record<string, any>;
     onSubmit?: (formData: any) => Promise<any>;
     onDelete?: (id: string) => Promise<void>;
+    onError?: ((err: any) => void);
 }
 interface ModalApi {
     showModal: (options: ModalOptions, slots?: Record<string, any>) => void;

package/dist/plugins/modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../src/plugins/modal.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,YAAY,EACf,MAAM,KAAK,CAAC;AACb,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhE,UAAU,YAAY;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAED,UAAU,gBAAgB;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,cAAc,CAAC,CAAC;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;IAC3C,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACzC;AAED,UAAU,QAAQ;IACjB,SAAS,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,OAAO,EAAE,gBAAgB,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChF,SAAS,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,WAAW,EAAE,YAAY,CAAC,QAAQ,CAAmB,CAAC;AAEnE,eAAO,MAAM,QAAQ,QAAO,QAI3B,CAAC;AAQF,eAAO,MAAM,WAAW,EAAE,MAuCzB,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../src/plugins/modal.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,YAAY,EACf,MAAM,KAAK,CAAC;AACb,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhE,UAAU,YAAY;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAED,UAAU,gBAAgB;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,EAAE,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,cAAc,CAAC,CAAC;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;IAC3C,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC,CAAC;CAC/B;AAED,UAAU,QAAQ;IACjB,SAAS,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACxE,aAAa,EAAE,CAAC,OAAO,EAAE,gBAAgB,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChF,SAAS,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,WAAW,EAAE,YAAY,CAAC,QAAQ,CAAmB,CAAC;AAEnE,eAAO,MAAM,QAAQ,QAAO,QAI3B,CAAC;AAQF,eAAO,MAAM,WAAW,EAAE,MAuCzB,CAAC"}

package/dist/style.css

@@ -546,11 +546,11 @@
   }
 }
 
-.modal-title[data-v-753a1016] {
+.modal-title[data-v-82698669] {
 	margin-top: 0.5rem;
 }
 @media screen and (max-width: 910px) {
-.modal-title[data-v-753a1016] {
+.modal-title[data-v-82698669] {
 		margin-top: 1rem;
 }
 }
@@ -741,37 +741,37 @@
   border-radius: var(--btn-border-radius);
 }
 
-.list-arrows[data-v-555ad739] {
+.list-arrows[data-v-2137a7a8] {
 	opacity: 0;
 }
-.list-arrows .bgl_icon-font[data-v-555ad739] {
+.list-arrows .bgl_icon-font[data-v-2137a7a8] {
 	transition: all ease-in-out 0.2s;
 }
-.list-arrows.sorted[data-v-555ad739] {
+.list-arrows.sorted[data-v-2137a7a8] {
 	opacity: 1;
 }
-.col img[data-v-555ad739] {
+.col img[data-v-2137a7a8] {
 	height: 35px;
 	margin-top: -14px;
 	margin-bottom: -14px;
 	border-radius: 5px;
 }
-.list-arrows.sorted .desc[data-v-555ad739] {
+.list-arrows.sorted .desc[data-v-2137a7a8] {
 	transform: rotate(180deg);
 }
-table[data-v-555ad739] {
+table[data-v-2137a7a8] {
 	border-collapse: separate;
 	border-spacing: 0 15px;
 	border-collapse: collapse;
 }
-th[data-v-555ad739] {
+th[data-v-2137a7a8] {
 	font-weight: 400;
 }
-.row[data-v-555ad739] {
+.row[data-v-2137a7a8] {
 	border-bottom: 1px solid var(--border-color);
 	cursor: pointer;
 }
-.row.first-row[data-v-555ad739] {
+.row.first-row[data-v-2137a7a8] {
 	font-size: 0.8rem;
 	color: var(--bgl-black-tint);
 	position: sticky;
@@ -781,7 +781,7 @@ th[data-v-555ad739] {
 	height: 50px;
 	vertical-align: bottom;
 }
-.row.first-row[data-v-555ad739]::after {
+.row.first-row[data-v-2137a7a8]::after {
 	content: "";
 	border-bottom: 1px solid var(--border-color);
 	position: absolute;
@@ -789,11 +789,11 @@ th[data-v-555ad739] {
 	right: 0;
 	bottom: -1px;
 }
-.first-row .col[data-v-555ad739] {
+.first-row .col[data-v-2137a7a8] {
 	cursor: pointer;
 	background: var(--bgl-white);
 }
-.col[data-v-555ad739] {
+.col[data-v-2137a7a8] {
 	white-space: nowrap;
 	padding: 14px;
 	transition: var(--bgl-transition);
@@ -802,16 +802,16 @@ th[data-v-555ad739] {
 	padding-right: 1rem;
 	align-items: center;
 }
-.col>div[data-v-555ad739] {
+.col>div[data-v-2137a7a8] {
 	display: flex;
 	gap: 0.5rem;
 }
-.max-col-width[data-v-555ad739] {
+.max-col-width[data-v-2137a7a8] {
 	max-width: 30vw;
 	overflow: hidden;
 	text-overflow: ellipsis;
 }
-.col.check .bgl_icon-font[data-v-555ad739] {
+.col.check .bgl_icon-font[data-v-2137a7a8] {
 	border-radius: 100%;
 	background: var(--bgl-blue-20);
 	color: var(--bgl-primary);
@@ -822,27 +822,27 @@ th[data-v-555ad739] {
 	justify-content: center;
 	margin-top: -2px;
 }
-.rows[data-v-555ad739] {
+.rows[data-v-2137a7a8] {
 	font-size: 0.8125em;
 }
-.table-list[data-v-555ad739] {
+.table-list[data-v-2137a7a8] {
 	height: 100%;
 	position: relative;
 	padding-left: 0 !important;
 	padding-right: 0 !important;
 	overflow: auto;
 }
-.BagelTable .table-list[data-v-555ad739] {
+.BagelTable .table-list[data-v-2137a7a8] {
 	overflow: unset;
 }
-.row-item[data-v-555ad739] {
+.row-item[data-v-2137a7a8] {
 	height: 50px;
 	transition: all 200ms ease;
 }
-.row-item[data-v-555ad739]:hover {
+.row-item[data-v-2137a7a8]:hover {
 	background: var(--bgl-gray-light);
 }
-.infinite-wrapper[data-v-555ad739] {
+.infinite-wrapper[data-v-2137a7a8] {
 	overflow-y: auto;
 	width: 100%;
 }
@@ -1230,7 +1230,7 @@ fieldset[disabled] .multiselect {
 	padding-inline-start: 0rem;
 }
 .multiselect--active .multiselect__input {
-	margin-top: -0.5rem;
+		margin-top: -0.6rem;
 }
 .multiselect__input::placeholder {
 	color: var(--input-color);
@@ -1676,77 +1676,77 @@ to {
 	/* width: auto; */
 }
 
-.bagel-input textarea[data-v-8c868409] {
+.bagel-input textarea[data-v-e116816b] {
 	min-height: unset;
 }
-.bagel-input.text-input textarea[data-v-8c868409] {
+.bagel-input.text-input textarea[data-v-e116816b] {
 	resize: none;
 }
-.code textarea[data-v-8c868409] {
+.code textarea[data-v-e116816b] {
 	font-family: 'Inconsolata', monospace;
 	background: var(--bgl-black) !important;
 	color: var(--bgl-white) !important;
 }
-.bagel-input.toggleEdit[data-v-8c868409]:hover {
+.bagel-input.toggleEdit[data-v-e116816b]:hover {
 	background-color: var(--input-bg);
 }
-.bagel-input.small[data-v-8c868409] {
+.bagel-input.small[data-v-e116816b] {
 	margin-bottom: 0;
 	height: 30px;
 }
-.bagel-input.dense label[data-v-8c868409] {
+.bagel-input.dense label[data-v-e116816b] {
 	display: flex;
 	align-items: center;
 	gap: 0.5rem;
 }
-.toggleEditBtn[data-v-8c868409] {
+.toggleEditBtn[data-v-e116816b] {
 	position: absolute;
 	right: -24px;
 	top: 4;
 	opacity: 0;
 }
-.textInputIconWrap[data-v-8c868409] {
+.textInputIconWrap[data-v-e116816b] {
 	position: relative;
 }
-.textInputIconWrap .bgl_icon-font[data-v-8c868409] {
+.textInputIconWrap .bgl_icon-font[data-v-e116816b] {
 	position: absolute;
 	inset-inline-end: 0.7rem;
 	bottom: 50%;
 	line-height: 0;
 	color: var(--bgl-gray);
 }
-.txtInputIconStart .iconStart[data-v-8c868409] {
+.txtInputIconStart .iconStart[data-v-e116816b] {
 	position: absolute;
 	inset-inline-start: 0.7rem;
 	top: 50%;
 	line-height: 0;
 	color: var(--bgl-gray);
 }
-.txtInputIconStart textarea[data-v-8c868409] {
+.txtInputIconStart textarea[data-v-e116816b] {
 	padding-inline-start: 2rem;
 }
-.bagel-input:hover .toggleEditBtn[data-v-8c868409],
-.bagel-input.editMode .toggleEditBtn[data-v-8c868409] {
+.bagel-input:hover .toggleEditBtn[data-v-e116816b],
+.bagel-input.editMode .toggleEditBtn[data-v-e116816b] {
 	opacity: 1;
 }
-.bagel-input.small textarea[data-v-8c868409] {
+.bagel-input.small textarea[data-v-e116816b] {
 	height: 30px;
 }
 
-.bagel-input[data-v-a5b28c58] {
+.bagel-input[data-v-64dc9f53] {
 	height: 100%;
 	margin: 0;
 }
-.bagel-input label[data-v-a5b28c58] {
+.bagel-input label[data-v-64dc9f53] {
 	margin-bottom: 0;
 }
-.bagel-input textarea[data-v-a5b28c58] {
+.bagel-input textarea[data-v-64dc9f53] {
 	height: 100%;
 	resize: none;
 	background: var(--input-bg);
 	margin-bottom: 0.5rem;
 }
-.character-limit[data-v-a5b28c58] {
+.character-limit[data-v-64dc9f53] {
 	font-size: 0.6rem;
 	color: var(--input-color);
 	position: absolute;

package/package.json

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

package/src/components/Modal.vue

@@ -1,15 +1,38 @@
 <template>
-	<div class="bg-dark" :class="{ 'is-side': side, 'is-active': isActive, 'bg-lignt': false }"
-		@click="() => (dismissable ? closeModal() : '')" @keydown.esc="closeModal">
-		<Card class="modal" @click.stop>
+	<div
+		class="bg-dark"
+		:class="{ 'is-side': side, 'is-active': isActive, 'bg-lignt': false }"
+		@click="() => (dismissable ? closeModal() : '')"
+		@keydown.esc="closeModal"
+	>
+		<Card
+			class="modal"
+			@click.stop
+		>
 			<header class="tool-bar">
 				<slot name="toolbar" />
-				<Btn :style="{ float: side ? 'left' : 'right' }" flat icon="close" @click="closeModal" />
-				<Title class="modal-title" tag="h3" v-if="title" :label="title" />
+				<Btn
+					:style="{ float: side ? 'left' : 'right' }"
+					flat
+					icon="close"
+					@click="closeModal"
+				/>
+				<Title
+					class="modal-title"
+					tag="h3"
+					v-if="title"
+					:label="title"
+				/>
 			</header>
 			<slot />
 			<footer class="modal-footer mt-3">
-				<Btn v-for="(action, i) in actions" :key="i" @click="closeModal" color="gray" v-bind="action" />
+				<Btn
+					v-for="(action, i) in actions"
+					:key="i"
+					@click="closeModal"
+					color="gray"
+					v-bind="action"
+				/>
 				<slot name="footer" />
 			</footer>
 		</Card>