@bagelink/vue 0.0.363 → 0.0.378

package/dist/index.mjs

@@ -4568,7 +4568,10 @@ var __publicField = (obj, key, value) => {
 };
 const axios = axios$1.create({
   // withCredentials to true to send cookies with requests
-  withCredentials: true
+  headers: {
+    "Allow-Control-Allow-Origin": "*",
+    withCredentials: true
+  }
 });
 class DataRequest {
   constructor(table, bagel) {
@@ -4584,7 +4587,7 @@ class DataRequest {
     if (!this.data_table)
       throw new Error("Data table not set");
     const { data: data2 } = await axios.post(
-      `${this.bagel.host}/data/${this.data_table}`,
+      `/data/${this.data_table}`,
       item
     );
     return data2;
@@ -4598,7 +4601,7 @@ class DataRequest {
     if (!this.data_table)
       throw new Error("Data table not set");
     const filterStr = Object.keys(this._filter).length ? `?filter={${Object.entries(this._filter).map(([k2, v2]) => `${k2}:${v2}`).join(",")}}` : "";
-    const url = `${this.bagel.host}/data/${this.data_table}${this.itemID ? `/${this.itemID}` : ""}${filterStr}`;
+    const url = `/data/${this.data_table}${this.itemID ? `/${this.itemID}` : ""}${filterStr}`;
     try {
       const { data: data2 } = await axios.get(url);
       return data2;
@@ -4616,18 +4619,18 @@ class DataRequest {
     if (!this.data_table)
       throw new Error("Data table not set");
     const { data: data2 } = await axios.delete(
-      `${this.bagel.host}/data/${this.data_table}/${this.itemID}`
+      `/data/${this.data_table}/${this.itemID}`
     );
     return data2;
   }
   async put(updatedItem) {
-    const { data_table, itemID, bagel } = this;
+    const { data_table, itemID } = this;
     if (!data_table)
       throw new Error("Data table not set");
     if (!itemID)
       throw new Error("Item ID not set");
     const { data: data2 } = await axios.put(
-      `${bagel.host}/data/${data_table}/${itemID}`,
+      `/data/${data_table}/${itemID}`,
       updatedItem
     );
     return data2;
@@ -4676,7 +4679,7 @@ class BagelAuth {
     formData.append("username", (user == null ? void 0 : user.email) || "");
     formData.append("password", (user == null ? void 0 : user.password) || "");
     try {
-      await axios.post(`${this.bagel.host}/auth/cookie/login`, formData, {
+      await axios.post("/auth/cookie/login", formData, {
         headers: {
           "Content-Type": "multipart/form-data",
           withCredentials: true
@@ -4690,7 +4693,7 @@ class BagelAuth {
   async logout() {
     var _a2, _b;
     try {
-      await axios.post(`${this.bagel.host}/auth/cookie/logout`);
+      await axios.post("/auth/cookie/logout");
     } catch (err) {
       (_b = (_a2 = this.bagel).onError) == null ? void 0 : _b.call(_a2, err);
       console.log(err);
@@ -4698,12 +4701,12 @@ class BagelAuth {
     this.user = null;
   }
   async acceptInvite(token, user) {
-    await axios.post(`${this.bagel.host}/auth/accept-invite/${token}`, user);
+    await axios.post(`/auth/accept-invite/${token}`, user);
     await this.login(user);
   }
   async register(user, errors) {
     try {
-      await axios.post(`${this.bagel.host}/auth/register`, user);
+      await axios.post("/auth/register", user);
       return this.login(user);
     } catch (err) {
       console.error(err);
@@ -4719,7 +4722,8 @@ class Bagel {
     __publicField(this, "onError");
     __publicField(this, "read_table", null);
     __publicField(this, "auth", new BagelAuth(this));
-    this.host = host;
+    this.host = host.replace(/\/$/, "");
+    axios.defaults.baseURL = this.host;
     this.onError = onError;
   }
   data(table) {
@@ -4734,7 +4738,7 @@ class Bagel {
       const queryParams = Object.entries(query).map(([key, value]) => `${key}=${value}`).join("&");
       endpoint = `${endpoint}?${queryParams}`;
     }
-    return axios.get(`${this.host}/api/${endpoint}`).then(({ data: data2 }) => data2);
+    return axios.get(`/api/${endpoint}`).then(({ data: data2 }) => data2);
   }
   async get(endpoint, query) {
     endpoint = this._endpointCleaner(endpoint);
@@ -4745,7 +4749,7 @@ class Bagel {
       if (queryParams)
         endpoint = `${endpoint}?${queryParams}`;
     }
-    const url = `${this.host}/${endpoint}`;
+    const url = `/${endpoint}`;
     return axios.get(url).then(({ data: data2 }) => data2).catch((err) => {
       var _a2;
       (_a2 = this.onError) == null ? void 0 : _a2.call(this, err);
@@ -4754,7 +4758,7 @@ class Bagel {
   }
   async delete(endpoint) {
     endpoint = this._endpointCleaner(endpoint);
-    return axios.delete(`${this.host}/${endpoint}`).then(({ data: data2 }) => data2).catch((err) => {
+    return axios.delete(`/${endpoint}`).then(({ data: data2 }) => data2).catch((err) => {
       var _a2;
       (_a2 = this.onError) == null ? void 0 : _a2.call(this, err);
       throw err;
@@ -4762,7 +4766,7 @@ class Bagel {
   }
   async put(endpoint, payload) {
     endpoint = this._endpointCleaner(endpoint);
-    return axios.put(`${this.host}/${endpoint}`, payload).then(({ data: data2 }) => data2).catch((err) => {
+    return axios.put(`/${endpoint}`, payload).then(({ data: data2 }) => data2).catch((err) => {
       var _a2;
       (_a2 = this.onError) == null ? void 0 : _a2.call(this, err);
       throw err;
@@ -4770,7 +4774,7 @@ class Bagel {
   }
   async patch(endpoint, payload = {}) {
     endpoint = this._endpointCleaner(endpoint);
-    return axios.patch(`${this.host}/${endpoint}`, payload).then(({ data: data2 }) => data2).catch((err) => {
+    return axios.patch(`/${endpoint}`, payload).then(({ data: data2 }) => data2).catch((err) => {
       var _a2;
       (_a2 = this.onError) == null ? void 0 : _a2.call(this, err);
       throw err;
@@ -4778,7 +4782,7 @@ class Bagel {
   }
   async post(endpoint, payload = {}) {
     endpoint = this._endpointCleaner(endpoint);
-    return axios.post(`${this.host}/${endpoint}`, payload).then(({ data: data2 }) => data2).catch((err) => {
+    return axios.post(`/${endpoint}`, payload).then(({ data: data2 }) => data2).catch((err) => {
       var _a2;
       (_a2 = this.onError) == null ? void 0 : _a2.call(this, err);
       throw err;
@@ -4787,7 +4791,7 @@ class Bagel {
   async uploadFile(file, options) {
     const formData = new FormData();
     formData.append("file", file);
-    const { data: data2 } = await axios.post(`${this.host}/files/upload`, formData, {
+    const { data: data2 } = await axios.post("/static_files/upload", formData, {
       headers: {
         "Content-Type": "multipart/form-data"
       },
@@ -4905,6 +4909,17 @@ function formatString(str, format2) {
   }
   return str;
 }
+function richText(id, label, options) {
+  return {
+    $el: "richtext",
+    class: options == null ? void 0 : options.class,
+    required: options == null ? void 0 : options.required,
+    id,
+    label,
+    placeholder: options == null ? void 0 : options.placeholder,
+    attrs: {}
+  };
+}
 function txtField(id, label, options) {
   return {
     $el: "text",
@@ -4951,6 +4966,7 @@ const BagelFormUtils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defi
   __proto__: null,
   frmRow,
   numField,
+  richText,
   slctField,
   txtField
 }, Symbol.toStringTag, { value: "Module" }));
@@ -5022,8 +5038,8 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$D = { class: "full-nav" };
-const _hoisted_2$v = { class: "nav-scroll" };
+const _hoisted_1$E = { class: "full-nav" };
+const _hoisted_2$x = { class: "nav-scroll" };
 const _hoisted_3$m = { class: "nav-links-wrapper" };
 const _hoisted_4$e = { class: "tooltip" };
 const _hoisted_5$b = { class: "bot-buttons-wrapper" };
@@ -5057,8 +5073,8 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
             class: "top-arrow"
           })
         ], 32),
-        createElementVNode("div", _hoisted_1$D, [
-          createElementVNode("div", _hoisted_2$v, [
+        createElementVNode("div", _hoisted_1$E, [
+          createElementVNode("div", _hoisted_2$x, [
             createElementVNode("div", _hoisted_3$m, [
               (openBlock(true), createElementBlock(Fragment$1, null, renderList(_ctx.links, (link) => {
                 return openBlock(), createBlock(resolveDynamicComponent(link.to ? "router-link" : "div"), {
@@ -5116,11 +5132,11 @@ const _export_sfc = (sfc, props2) => {
   return target;
 };
 const NavBar = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-727b754a"]]);
-const _hoisted_1$C = {
+const _hoisted_1$D = {
   key: 0,
   class: "loading"
 };
-const _hoisted_2$u = {
+const _hoisted_2$w = {
   key: 1,
   class: "bgl_btn-flex"
 };
@@ -5211,7 +5227,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
         })
       }, {
         default: withCtx(() => [
-          _ctx.loading ? (openBlock(), createElementBlock("div", _hoisted_1$C)) : (openBlock(), createElementBlock("div", _hoisted_2$u, [
+          _ctx.loading ? (openBlock(), createElementBlock("div", _hoisted_1$D)) : (openBlock(), createElementBlock("div", _hoisted_2$w, [
             _ctx.icon ? (openBlock(), createBlock(unref(_sfc_main$H), {
               key: 0,
               icon: _ctx.icon
@@ -5232,8 +5248,8 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
   }
 });
 const Btn = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["__scopeId", "data-v-d09a83c5"]]);
-const _hoisted_1$B = { class: "tool-bar" };
-const _hoisted_2$t = { class: "modal-footer mt-3" };
+const _hoisted_1$C = { class: "tool-bar" };
+const _hoisted_2$v = { class: "modal-footer mt-3" };
 const _sfc_main$E = /* @__PURE__ */ defineComponent({
   __name: "Modal",
   props: {
@@ -5281,7 +5297,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
           }, ["stop"]))
         }, {
           default: withCtx(() => [
-            createElementVNode("header", _hoisted_1$B, [
+            createElementVNode("header", _hoisted_1$C, [
               renderSlot(_ctx.$slots, "toolbar"),
               createVNode(unref(Btn), {
                 style: normalizeStyle({ float: _ctx.side ? "left" : "right" }),
@@ -5297,7 +5313,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
               }, null, 8, ["label"])) : createCommentVNode("", true)
             ]),
             renderSlot(_ctx.$slots, "default"),
-            createElementVNode("footer", _hoisted_2$t, [
+            createElementVNode("footer", _hoisted_2$v, [
               (openBlock(true), createElementBlock(Fragment$1, null, renderList(_ctx.actions, (action, i2) => {
                 return openBlock(), createBlock(unref(Btn), mergeProps({
                   key: i2,
@@ -5423,8 +5439,8 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
   }
 });
 const ModalForm = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["__scopeId", "data-v-7e6899c7"]]);
-const _hoisted_1$A = { class: "accordion-item" };
-const _hoisted_2$s = ["aria-expanded", "aria-controls"];
+const _hoisted_1$B = { class: "accordion-item" };
+const _hoisted_2$u = ["aria-expanded", "aria-controls"];
 const _hoisted_3$l = { class: "accordion-label" };
 const _hoisted_4$d = ["id", "aria-hidden"];
 const _sfc_main$C = /* @__PURE__ */ defineComponent({
@@ -5451,7 +5467,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
         accordionState.openItem = null;
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$A, [
+      return openBlock(), createElementBlock("div", _hoisted_1$B, [
         createElementVNode("button", {
           onClick: _cache[0] || (_cache[0] = ($event) => toggle()),
           "aria-expanded": unref(open) ? "true" : "false",
@@ -5464,7 +5480,7 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
           }, [
             createVNode(unref(_sfc_main$H), { icon: "expand_more" })
           ], 2)
-        ], 8, _hoisted_2$s),
+        ], 8, _hoisted_2$u),
         createVNode(Transition, { name: "expand" }, {
           default: withCtx(() => [
             unref(open) ? (openBlock(), createElementBlock("div", {
@@ -5483,15 +5499,15 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
   }
 });
 const AccordionItem = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["__scopeId", "data-v-bf74738b"]]);
-const _hoisted_1$z = { class: "list-wrap bgl_card thin grid overflow-hidden h-100 p-0" };
-const _hoisted_2$r = { class: "p-1" };
+const _hoisted_1$A = { class: "list-wrap bgl_card thin grid overflow-hidden h-100 p-0" };
+const _hoisted_2$t = { class: "p-1" };
 const _hoisted_3$k = { class: "list-content auto-flow-rows align-items-start overflow-y h-100" };
 const _sfc_main$B = /* @__PURE__ */ defineComponent({
   __name: "ListView",
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$z, [
-        createElementVNode("div", _hoisted_2$r, [
+      return openBlock(), createElementBlock("div", _hoisted_1$A, [
+        createElementVNode("div", _hoisted_2$t, [
           renderSlot(_ctx.$slots, "header")
         ]),
         createElementVNode("div", _hoisted_3$k, [
@@ -5501,8 +5517,8 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$y = { class: "txt16 no-margin ellipsis" };
-const _hoisted_2$q = { class: "txt14 no-margin txt-gray ellipsis" };
+const _hoisted_1$z = { class: "txt16 no-margin ellipsis" };
+const _hoisted_2$s = { class: "txt14 no-margin txt-gray ellipsis" };
 const _sfc_main$A = /* @__PURE__ */ defineComponent({
   __name: "ListItem",
   props: {
@@ -5527,11 +5543,11 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
             size: 40
           }, null, 8, ["name", "src"])) : createCommentVNode("", true),
           createElementVNode("div", null, [
-            createElementVNode("p", _hoisted_1$y, [
+            createElementVNode("p", _hoisted_1$z, [
               createTextVNode(toDisplayString(_ctx.title) + " ", 1),
               renderSlot(_ctx.$slots, "default")
             ]),
-            createElementVNode("p", _hoisted_2$q, [
+            createElementVNode("p", _hoisted_2$s, [
               createTextVNode(toDisplayString(_ctx.subtitle) + " ", 1),
               renderSlot(_ctx.$slots, "subtitle")
             ])
@@ -5542,8 +5558,8 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$x = { class: "page-top" };
-const _hoisted_2$p = { class: "top-title" };
+const _hoisted_1$y = { class: "page-top" };
+const _hoisted_2$r = { class: "top-title" };
 const _sfc_main$z = /* @__PURE__ */ defineComponent({
   __name: "PageTitle",
   props: {
@@ -5554,8 +5570,8 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$x, [
-        createElementVNode("h1", _hoisted_2$p, [
+      return openBlock(), createElementBlock("div", _hoisted_1$y, [
+        createElementVNode("h1", _hoisted_2$r, [
           renderSlot(_ctx.$slots, "default"),
           createTextVNode(" " + toDisplayString(__props.value), 1)
         ])
@@ -5563,8 +5579,8 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$w = { class: "table-list-wrap h-100" };
-const _hoisted_2$o = { class: "infinite-wrapper" };
+const _hoisted_1$x = { class: "table-list-wrap h-100" };
+const _hoisted_2$q = { class: "infinite-wrapper" };
 const _hoisted_3$j = { class: "row first-row" };
 const _hoisted_4$c = ["onClick"];
 const _hoisted_5$a = { class: "flex" };
@@ -5604,8 +5620,8 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
       emit2("orderBy", `${fieldname} ${sortDirection.value}`.trim());
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$w, [
-        createElementVNode("table", _hoisted_2$o, [
+      return openBlock(), createElementBlock("div", _hoisted_1$x, [
+        createElementVNode("table", _hoisted_2$q, [
           createElementVNode("thead", _hoisted_3$j, [
             (openBlock(true), createElementBlock(Fragment$1, null, renderList(computedSchema.value, (field) => {
               return openBlock(), createElementBlock("th", {
@@ -5664,9 +5680,9 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
 });
 const TableSchema = /* @__PURE__ */ _export_sfc(_sfc_main$y, [["__scopeId", "data-v-f3641508"]]);
 const _sfc_main$x = {};
-const _hoisted_1$v = { class: "flex space-between" };
+const _hoisted_1$w = { class: "flex space-between" };
 function _sfc_render$1(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$v, [
+  return openBlock(), createElementBlock("div", _hoisted_1$w, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
@@ -5694,11 +5710,11 @@ function _sfc_render(_ctx, _cache) {
   });
 }
 const RouterWrapper = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["render", _sfc_render]]);
-const _hoisted_1$u = {
+const _hoisted_1$v = {
   key: 0,
   class: "data"
 };
-const _hoisted_2$n = {
+const _hoisted_2$p = {
   key: 0,
   class: "data-row"
 };
@@ -5720,7 +5736,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     const itemData = useModel(__props, "data");
     return (_ctx, _cache) => {
       var _a2;
-      return __props.data ? (openBlock(), createElementBlock("div", _hoisted_1$u, [
+      return __props.data ? (openBlock(), createElementBlock("div", _hoisted_1$v, [
         _ctx.title ? (openBlock(), createBlock(unref(_sfc_main$s), {
           key: 0,
           label: _ctx.title
@@ -5729,7 +5745,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
           return openBlock(), createElementBlock(Fragment$1, {
             key: field.id
           }, [
-            unref(iffer)(field, itemData.value) ? (openBlock(), createElementBlock("div", _hoisted_2$n, [
+            unref(iffer)(field, itemData.value) ? (openBlock(), createElementBlock("div", _hoisted_2$p, [
               createElementVNode("div", _hoisted_3$i, toDisplayString((field == null ? void 0 : field.label) || unref(keyToLabel)(field.id)), 1),
               createVNode(unref(_sfc_main$l), {
                 field,
@@ -5756,9 +5772,11 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
   }
 });
 const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["__scopeId", "data-v-bb2526f9"]]);
+const _hoisted_1$u = { class: "card_label" };
 const _sfc_main$u = /* @__PURE__ */ defineComponent({
   __name: "Card",
   props: {
+    label: {},
     thin: { type: Boolean },
     outline: { type: Boolean },
     h100: { type: Boolean },
@@ -5771,13 +5789,14 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["bgl_card", {
           thin: _ctx.thin,
-          border: _ctx.outline,
+          "border": _ctx.outline,
           "h-100": _ctx.h100,
           [_ctx.bg || ""]: _ctx.bg,
           "overflow-x": _ctx.overflowX,
           "overflow-y": _ctx.overflowY
         }])
       }, [
+        createElementVNode("span", _hoisted_1$u, toDisplayString(_ctx.label), 1),
         renderSlot(_ctx.$slots, "default")
       ], 2);
     };
@@ -5854,6 +5873,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$s = ["dismissable"];
+const _hoisted_2$o = { class: "m-0" };
 const _sfc_main$q = /* @__PURE__ */ defineComponent({
   __name: "Alert",
   props: {
@@ -5880,7 +5900,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
           size: 2,
           color: color2[_ctx.type]
         }, null, 8, ["icon", "color"]),
-        createElementVNode("p", null, toDisplayString(_ctx.message), 1),
+        createElementVNode("p", _hoisted_2$o, toDisplayString(_ctx.message), 1),
         createVNode(Btn, {
           onClick: _cache[0] || (_cache[0] = ($event) => isDismissed.value = true),
           flat: "",
@@ -5892,7 +5912,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Alert = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-94bfcb05"]]);
+const Alert = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-4017e821"]]);
 const _sfc_main$p = /* @__PURE__ */ defineComponent({
   __name: "Badge",
   props: {
@@ -5925,7 +5945,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
 });
 const Badge = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-10743b06"]]);
 const _hoisted_1$r = { class: "bgl_vid" };
-const _hoisted_2$m = ["src"];
+const _hoisted_2$n = ["src"];
 const _hoisted_3$h = ["src", "autoplay", "muted", "loop", "controls"];
 const _sfc_main$o = /* @__PURE__ */ defineComponent({
   __name: "BglVideo",
@@ -5974,7 +5994,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
           frameborder: "0",
           allowfullscreen: "",
           title: "Video"
-        }, null, 12, _hoisted_2$m)) : (openBlock(), createElementBlock("video", {
+        }, null, 12, _hoisted_2$n)) : (openBlock(), createElementBlock("video", {
           key: 1,
           src: _ctx.src,
           autoplay: _ctx.autoplay,
@@ -5993,7 +6013,7 @@ const _hoisted_1$q = {
   key: 0,
   class: "blocker"
 };
-const _hoisted_2$l = { class: "Handlers" };
+const _hoisted_2$m = { class: "Handlers" };
 const _sfc_main$n = /* @__PURE__ */ defineComponent({
   __name: "Carousel",
   props: {
@@ -6156,7 +6176,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
           unref(isDragging) ? (openBlock(), createElementBlock("div", _hoisted_1$q)) : createCommentVNode("", true),
           renderSlot(_ctx.$slots, "default", {}, void 0, true)
         ], 34),
-        createElementVNode("div", _hoisted_2$l, [
+        createElementVNode("div", _hoisted_2$m, [
           createElementVNode("span", { onClick: prev }, [
             renderSlot(_ctx.$slots, "prev", {}, void 0, true)
           ]),
@@ -6177,7 +6197,8 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
     schema: {},
     modelValue: { default: () => ({}) },
     onDelete: {},
-    onSubmit: {}
+    onSubmit: {},
+    status: {}
   },
   emits: ["update:modelValue", "submit", "dirty"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -6206,17 +6227,13 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
       return (_b = (_a2 = form.value) == null ? void 0 : _a2.reportValidity) == null ? void 0 : _b.call(_a2);
     };
     const clearForm = () => Object.assign(data2.value, {});
-    let formStatus = ref("idle");
     const runSubmit = () => {
       var _a2;
-      try {
-        validateForm();
-        (_a2 = props2.onSubmit) == null ? void 0 : _a2.call(props2, data2.value);
-        clearForm();
-        formStatus.value = "success";
-      } catch (e) {
-        formStatus.value = "error";
-      }
+      const isValid2 = validateForm();
+      if (!isValid2)
+        return;
+      (_a2 = props2.onSubmit) == null ? void 0 : _a2.call(props2, data2.value);
+      clearForm();
     };
     const i18nT = (val) => val;
     const deleteItem = () => {
@@ -6249,7 +6266,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
             modelValue: data2.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => data2.value = $event)
           }, null, 8, ["field", "modelValue"]);
-        }), 128)) : !unref(slots).success || unref(formStatus) !== "success" ? (openBlock(), createElementBlock("form", {
+        }), 128)) : !unref(slots).success || _ctx.status !== "success" ? (openBlock(), createElementBlock("form", {
           key: 1,
           ref_key: "form",
           ref: form,
@@ -6270,8 +6287,8 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
           }), 128)),
           renderSlot(_ctx.$slots, "submit")
         ], 544)) : createCommentVNode("", true),
-        unref(formStatus) === "success" ? renderSlot(_ctx.$slots, "success", { key: 2 }) : createCommentVNode("", true),
-        unref(formStatus) === "error" ? renderSlot(_ctx.$slots, "error", { key: 3 }) : createCommentVNode("", true)
+        _ctx.status === "success" ? renderSlot(_ctx.$slots, "success", { key: 2 }) : createCommentVNode("", true),
+        _ctx.status === "error" ? renderSlot(_ctx.$slots, "error", { key: 3 }) : createCommentVNode("", true)
       ], 64);
     };
   }
@@ -6294,6 +6311,8 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
         return ToggleInput;
       if (props2.field.$el === "check")
         return CheckInput;
+      if (props2.field.$el === "richtext")
+        return _sfc_main$8;
       return props2.field.$el || "div";
     });
     const emit2 = __emit;
@@ -6309,7 +6328,11 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
         data2[props2.field.id] = val;
         emit2("update:modelValue", data2);
       },
-      get: () => props2.field.id ? props2.modelValue[props2.field.id] : props2.field.defaultValue || ""
+      get: () => {
+        if (props2.field.id)
+          return props2.modelValue[props2.field.id];
+        return props2.field.defaultValue || "";
+      }
     });
     const vIf = computed(() => {
       var _a2, _b;
@@ -6368,7 +6391,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
 });
 const _withScopeId$1 = (n2) => (pushScopeId("data-v-e8219826"), n2 = n2(), popScopeId(), n2);
 const _hoisted_1$p = ["title"];
-const _hoisted_2$k = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("svg", {
+const _hoisted_2$l = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("svg", {
   xmlns: "http://www.w3.org/2000/svg",
   height: "24",
   viewBox: "0 -960 960 960",
@@ -6377,7 +6400,7 @@ const _hoisted_2$k = /* @__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$g = [
-  _hoisted_2$k
+  _hoisted_2$l
 ];
 const _hoisted_4$a = ["required", "id"];
 const _sfc_main$k = /* @__PURE__ */ defineComponent({
@@ -15031,7 +15054,7 @@ Object.entries(Mo).forEach(([e, t]) => {
   e !== "default" && (Va[e] = t);
 });
 const _hoisted_1$o = ["title"];
-const _hoisted_2$j = { key: 0 };
+const _hoisted_2$k = { key: 0 };
 const _sfc_main$j = /* @__PURE__ */ defineComponent({
   __name: "DateInput",
   props: {
@@ -15069,7 +15092,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
         class: normalizeClass(["bagel-input", { small: _ctx.small }]),
         title: _ctx.label
       }, [
-        _ctx.label ? (openBlock(), createElementBlock("label", _hoisted_2$j, toDisplayString(_ctx.label), 1)) : createCommentVNode("", true),
+        _ctx.label ? (openBlock(), createElementBlock("label", _hoisted_2$k, toDisplayString(_ctx.label), 1)) : createCommentVNode("", true),
         createVNode(unref(Va), mergeProps({
           ref_key: "datePicker",
           ref: datePicker,
@@ -15083,7 +15106,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$n = ["title"];
-const _hoisted_2$i = { key: 0 };
+const _hoisted_2$j = { key: 0 };
 const _hoisted_3$f = ["value", "placeholder"];
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "JSONInput",
@@ -15108,7 +15131,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
         class: normalizeClass(["bagel-input", { small: _ctx.small }]),
         title: _ctx.description
       }, [
-        _ctx.label ? (openBlock(), createElementBlock("label", _hoisted_2$i, [
+        _ctx.label ? (openBlock(), createElementBlock("label", _hoisted_2$j, [
           createVNode(_component_LangText, { input: _ctx.label }, null, 8, ["input"])
         ])) : createCommentVNode("", true),
         createElementVNode("textarea", {
@@ -15123,7 +15146,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
 });
 const JSONInput = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-1fc4f739"]]);
 const _hoisted_1$m = ["disabled"];
-const _hoisted_2$h = ["value"];
+const _hoisted_2$i = ["value"];
 const _hoisted_3$e = ["onClick"];
 const _sfc_main$h = /* @__PURE__ */ defineComponent({
   __name: "SelectInput",
@@ -15321,7 +15344,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
               onInput: _cache[1] || (_cache[1] = ($event) => updateOpen(true)),
               value: selectedItems.value,
               required: ""
-            }, null, 40, _hoisted_2$h)) : createCommentVNode("", true)
+            }, null, 40, _hoisted_2$i)) : createCommentVNode("", true)
           ])
         ]),
         _: 3
@@ -15329,7 +15352,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-70fd5ae7"]]);
+const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-ab376074"]]);
 /*!
   * vue-draggable-next v2.2.0
   * (c) 2023 Anish George
@@ -17853,7 +17876,7 @@ const VueDraggableNext = defineComponent({
   }
 });
 const _hoisted_1$l = ["title"];
-const _hoisted_2$g = { class: "bagel-input" };
+const _hoisted_2$h = { class: "bagel-input" };
 const _hoisted_3$d = { class: "table-side-scroll" };
 const _hoisted_4$9 = { class: "table-header" };
 const _hoisted_5$8 = { class: "table-reorder" };
@@ -17923,7 +17946,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
         class: "table-field-wrap",
         title: _ctx.description
       }, [
-        createElementVNode("div", _hoisted_2$g, [
+        createElementVNode("div", _hoisted_2$h, [
           createElementVNode("label", null, toDisplayString((_a2 = unref(fieldMeta)) == null ? void 0 : _a2.label), 1)
         ]),
         createElementVNode("div", _hoisted_3$d, [
@@ -18004,7 +18027,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
 });
 const TableField = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-cdacf10e"]]);
 const _hoisted_1$k = ["title"];
-const _hoisted_2$f = ["for"];
+const _hoisted_2$g = ["for"];
 const _hoisted_3$c = ["title", "autocomplete", "id", "type", "placeholder", "disabled", "required", "pattern"];
 const _hoisted_4$8 = ["title", "id", "type", "rows", "placeholder", "disabled", "required", "pattern"];
 const _hoisted_5$7 = { key: 2 };
@@ -18141,7 +18164,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
             [vModelText, unref(inputVal)]
           ]),
           _ctx.helptext ? (openBlock(), createElementBlock("p", _hoisted_5$7, toDisplayString(_ctx.helptext), 1)) : createCommentVNode("", true)
-        ], 8, _hoisted_2$f),
+        ], 8, _hoisted_2$g),
         _ctx.iconStart ? (openBlock(), createBlock(unref(_sfc_main$H), {
           key: 0,
           class: "iconStart",
@@ -18163,7 +18186,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-cd4c27ad"]]);
+const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-df718b64"]]);
 const _hoisted_1$j = { class: "primary-checkbox" };
 const _sfc_main$e = /* @__PURE__ */ defineComponent({
   __name: "Checkbox",
@@ -18194,7 +18217,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
 });
 const Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-e4cbb088"]]);
 const _hoisted_1$i = ["title"];
-const _hoisted_2$e = ["id", "placeholder", "required"];
+const _hoisted_2$f = ["id", "placeholder", "required"];
 const _sfc_main$d = /* @__PURE__ */ defineComponent({
   __name: "ColorPicker",
   props: {
@@ -18231,7 +18254,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
             placeholder: _ctx.placeholder || _ctx.label,
             class: { "no-edit": !_ctx.editMode },
             required: _ctx.required
-          }, _ctx.nativeInputAttrs), null, 16, _hoisted_2$e), [
+          }, _ctx.nativeInputAttrs), null, 16, _hoisted_2$f), [
             [vModelText, inputVal.value]
           ])
         ])
@@ -18240,7 +18263,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$h = { class: "datetime-wrap" };
-const _hoisted_2$d = { class: "date-wrap" };
+const _hoisted_2$e = { class: "date-wrap" };
 const _hoisted_3$b = {
   key: 0,
   class: "time-wrap"
@@ -18250,7 +18273,8 @@ const _hoisted_5$6 = ["for"];
 const _sfc_main$c = /* @__PURE__ */ defineComponent({
   __name: "DatePicker",
   props: {
-    name: {},
+    label: {},
+    id: {},
     options: {},
     showTimeWrap: { type: Boolean }
   },
@@ -18264,7 +18288,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$h, [
-        createElementVNode("div", _hoisted_2$d, [
+        createElementVNode("div", _hoisted_2$e, [
           createVNode(unref(Va), mergeProps({
             inline: "",
             "week-start": "0",
@@ -18284,15 +18308,15 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
             return openBlock(), createElementBlock(Fragment$1, { key: hr2 }, [
               withDirectives(createElementVNode("input", {
                 type: "radio",
-                id: `${hr2}_${_ctx.name}`,
-                name: _ctx.name,
+                id: `${hr2}_${_ctx.id}`,
+                name: _ctx.label,
                 value: hr2,
                 "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => selectedHour.value = $event)
               }, null, 8, _hoisted_4$7), [
                 [vModelRadio, selectedHour.value]
               ]),
               createElementVNode("label", {
-                for: `${hr2}_${_ctx.name}`
+                for: `${hr2}_${_ctx.id}`
               }, toDisplayString(hr2), 9, _hoisted_5$6)
             ], 64);
           }), 128))
@@ -18302,7 +18326,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$g = { class: "bagel-input" };
-const _hoisted_2$c = { class: "pb-025" };
+const _hoisted_2$d = { class: "pb-025" };
 const _hoisted_3$a = { class: "flex gap-05 flex-wrap" };
 const _hoisted_4$6 = ["id", "name", "value", "checked"];
 const _hoisted_5$5 = ["for"];
@@ -18346,7 +18370,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$g, [
-        createElementVNode("label", _hoisted_2$c, toDisplayString(_ctx.label), 1),
+        createElementVNode("label", _hoisted_2$d, toDisplayString(_ctx.label), 1),
         createElementVNode("div", _hoisted_3$a, [
           (openBlock(true), createElementBlock(Fragment$1, null, renderList(cumputedOptions.value, ({ optioId, label, value }, index2) => {
             return openBlock(), createElementBlock("div", {
@@ -18371,7 +18395,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
 });
 const RadioPillsInput = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-e47ae8b5"]]);
 const _hoisted_1$f = { class: "bagel-input" };
-const _hoisted_2$b = {
+const _hoisted_2$c = {
   key: 0,
   class: "imagePreviewWrap"
 };
@@ -18409,20 +18433,28 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     const file_ids = useModel(__props, "modelValue");
     const storageFiles = ref([]);
     const compareIds = (v1, v2) => [v1].flat().join(",") === [v2].flat().join(",");
-    watch(() => props2.files, (newFiles) => {
-      if (newFiles)
-        storageFiles.value.push(...[newFiles].flat());
-    }, { immediate: true });
-    watch(() => storageFiles.value, (newFiles) => {
-      var _a2;
-      let idValue = "";
-      if (props2.multiple)
-        idValue = newFiles.map((f2) => f2.id || "");
-      else
-        idValue = ((_a2 = newFiles[0]) == null ? void 0 : _a2.id) || "";
-      if (!compareIds(file_ids == null ? void 0 : file_ids.value, idValue))
-        file_ids.value = idValue;
-    }, { deep: true });
+    watch(
+      () => props2.files,
+      (newFiles) => {
+        if (newFiles)
+          storageFiles.value.push(...[newFiles].flat());
+      },
+      { immediate: true }
+    );
+    watch(
+      () => storageFiles.value,
+      (newFiles) => {
+        var _a2;
+        let idValue = "";
+        if (props2.multiple)
+          idValue = newFiles.map((f2) => f2.id || "");
+        else
+          idValue = ((_a2 = newFiles[0]) == null ? void 0 : _a2.id) || "";
+        if (!compareIds(file_ids == null ? void 0 : file_ids.value, idValue))
+          file_ids.value = idValue;
+      },
+      { deep: true }
+    );
     const fileQueue = ref([]);
     let isDragOver = ref(false);
     const preventDefault = (e) => {
@@ -18433,21 +18465,20 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     const removeFile = (file) => {
       const index2 = storageFiles.value.indexOf(file);
       storageFiles.value.splice(index2, 1);
-      if (props2.deleteEndpoint)
+      if (props2.deleteEndpoint) {
         void bagel.delete(`${props2.deleteEndpoint}/${file.id}`);
+      }
     };
     const flushQueue = () => {
-      fileQueue.value.forEach(
-        async (file, i2) => {
-          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);
-          fileQueue.value.splice(i2, 1);
-        }
-      );
+      fileQueue.value.forEach(async (file, i2) => {
+        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);
+        fileQueue.value.splice(i2, 1);
+      });
     };
     const browse = () => {
       const input = document.createElement("input");
@@ -18456,7 +18487,9 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
       input.onchange = (e) => {
         const target = e == null ? void 0 : e.target;
         if (target == null ? void 0 : 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();
       };
@@ -18494,13 +18527,16 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
           onDragover: dragover,
           onDrop: drop3,
           onDragleave: dragleave,
-          class: normalizeClass(["fileUploadWrap", { fileDropZone: !storageFiles.value.length && !fileQueue.value.length, dragover: unref(isDragOver) }])
+          class: normalizeClass(["fileUploadWrap", {
+            fileDropZone: !storageFiles.value.length && !fileQueue.value.length,
+            dragover: unref(isDragOver)
+          }])
         }, [
           (openBlock(true), createElementBlock(Fragment$1, null, renderList(storageFiles.value, (file) => {
             return openBlock(), createElementBlock(Fragment$1, {
               key: file.id
             }, [
-              !_ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_2$b, [
+              !_ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_2$c, [
                 createElementVNode("img", {
                   class: "preview",
                   src: file.url,
@@ -18564,12 +18600,12 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const FileUpload = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-1be8d7b1"]]);
+const FileUpload = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-3bb24b0c"]]);
 const _withScopeId = (n2) => (pushScopeId("data-v-b87221d6"), n2 = n2(), popScopeId(), n2);
 const _hoisted_1$e = ["title"];
-const _hoisted_2$a = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("span", { class: "slider round" }, null, -1));
+const _hoisted_2$b = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("span", { class: "slider round" }, null, -1));
 const _hoisted_3$8 = [
-  _hoisted_2$a
+  _hoisted_2$b
 ];
 const _hoisted_4$4 = ["id"];
 const _sfc_main$9 = /* @__PURE__ */ defineComponent({
@@ -39059,7 +39095,11 @@ defineComponent({
     }, (_b = (_a2 = this.$slots).default) === null || _b === void 0 ? void 0 : _b.call(_a2));
   }
 });
-const _hoisted_1$d = { key: 0 };
+const _hoisted_1$d = { class: "RichText" };
+const _hoisted_2$a = {
+  key: 0,
+  class: "RichText-tools"
+};
 const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   __name: "RichText",
   props: {
@@ -39076,7 +39116,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
     const config = [
       {
-        name: "bold",
+        name: "Bold",
         command: () => {
           var _a2;
           return (_a2 = focus2()) == null ? void 0 : _a2.toggleBold().run();
@@ -39088,7 +39128,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         }
       },
       {
-        name: "italic",
+        name: "Italic",
         command: () => focus2().toggleItalic().run(),
         icon: "format_italic",
         disabled: () => {
@@ -39097,7 +39137,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         }
       },
       {
-        name: "strike",
+        name: "Strike",
         command: () => focus2().toggleStrike().run(),
         icon: "format_strikethrough",
         disabled: () => {
@@ -39106,93 +39146,93 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         }
       },
       {
-        name: "code",
+        name: "Code Text",
         command: () => focus2().toggleCode().run(),
         icon: "code"
       },
+      // {
+      // 	name: 'clearMarks',
+      // 	command: () => focus().unsetAllMarks(),
+      // 	icon: 'clear',
+      // },
       {
-        name: "clearMarks",
-        command: () => focus2().unsetAllMarks(),
-        icon: "clear"
-      },
-      {
-        name: "clearNodes",
+        name: "Clear",
         command: () => focus2().clearNodes().run(),
-        icon: "clear"
+        icon: "format_clear"
       },
       {
-        name: "paragraph",
+        name: "Paragraph",
         command: () => focus2().setParagraph().run(),
         icon: "format_paragraph"
       },
       {
-        name: "heading",
+        name: "Heading",
         command: () => focus2().toggleHeading({ level: 1 }).run(),
         icon: "format_h1",
         option: { level: 1 }
       },
       {
-        name: "heading",
+        name: "Heading",
         command: () => focus2().toggleHeading({ level: 2 }).run(),
         icon: "format_h2",
         option: { level: 2 }
       },
       {
-        name: "heading",
+        name: "Heading",
         command: () => focus2().toggleHeading({ level: 3 }).run(),
         icon: "format_h3",
         option: { level: 3 }
       },
       {
-        name: "heading",
+        name: "Heading",
         command: () => focus2().toggleHeading({ level: 4 }).run(),
         icon: "format_h4",
         option: { level: 4 }
       },
       {
-        name: "heading",
+        name: "Heading",
         command: () => focus2().toggleHeading({ level: 5 }).run(),
         icon: "format_h5",
         option: { level: 5 }
       },
       {
-        name: "heading",
+        name: "Heading",
         command: () => focus2().toggleHeading({ level: 6 }).run(),
         icon: "format_h6",
         option: { level: 6 }
       },
       {
-        name: "bulletList",
+        name: "Bullet List",
         command: () => focus2().toggleBulletList().run(),
         icon: "format_list_bulleted"
       },
       {
-        name: "orderedList",
+        name: "Ordered List",
         command: () => focus2().toggleOrderedList().run(),
         icon: "format_list_numbered"
       },
       {
-        name: "codeBlock",
+        name: "Code Block",
         command: () => focus2().toggleCodeBlock().run(),
-        icon: "code"
+        icon: "code_blocks"
       },
       {
-        name: "blockquote",
+        name: "Blockquote",
         command: () => focus2().toggleBlockquote().run(),
         icon: "format_quote"
       },
       {
-        name: "horizontalRule",
+        name: "Horizontal Rule",
         command: () => focus2().setHorizontalRule().run(),
         icon: "horizontal_rule"
       },
       {
-        name: "hardBreak",
+        name: "Hard Break",
         command: () => focus2().setHardBreak().run(),
         icon: "keyboard_return"
       },
       {
-        name: "undo",
+        name: "Undo",
         command: () => focus2().undo().run(),
         icon: "undo",
         disabled: () => {
@@ -39201,7 +39241,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         }
       },
       {
-        name: "redo",
+        name: "Redo",
         command: () => focus2().redo().run(),
         icon: "redo",
         disabled: () => {
@@ -39221,8 +39261,10 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     watch(
       () => props2.modelValue,
       (value) => {
-        var _a2;
-        return (_a2 = editor.value) == null ? void 0 : _a2.commands.setContent(value);
+        var _a2, _b;
+        if (((_a2 = editor.value) == null ? void 0 : _a2.getHTML()) === value)
+          return;
+        (_b = editor.value) == null ? void 0 : _b.commands.setContent(value, false);
       },
       { immediate: true }
     );
@@ -39233,8 +39275,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       const _directive_tooltip = resolveDirective("tooltip");
-      return openBlock(), createElementBlock(Fragment$1, null, [
-        unref(editor) ? (openBlock(), createElementBlock("div", _hoisted_1$d, [
+      return openBlock(), createElementBlock("div", _hoisted_1$d, [
+        unref(editor) ? (openBlock(), createElementBlock("div", _hoisted_2$a, [
           (openBlock(), createElementBlock(Fragment$1, null, renderList(config, (item) => {
             var _a2;
             return withDirectives(createVNode(unref(Btn), {
@@ -39250,7 +39292,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
           }), 64))
         ])) : createCommentVNode("", true),
         createVNode(unref(EditorContent), { editor: unref(editor) }, null, 8, ["editor"])
-      ], 64);
+      ]);
     };
   }
 });
@@ -45715,7 +45757,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SidebarMenu = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-24905642"]]);
+const SidebarMenu = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-65bec778"]]);
 const _hoisted_1$4 = { class: "m-0 pb-025 txt14 line-height-1" };
 const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   __name: "BottomMenu",