@fewangsit/wangsvue 1.5.217-alpha.1 → 1.5.218-alpha.0

package/codesnippet/index.es.js

@@ -0,0 +1,118 @@
+import { defineComponent as T, mergeModels as H, useModel as S, inject as B, ref as k, shallowRef as w, computed as N, onMounted as P, watch as V, createElementBlock as d, openBlock as r, createBlock as $, createCommentVNode as x, createElementVNode as o, mergeProps as u, unref as m, withDirectives as z, vModelText as D, Fragment as E, renderList as W, toDisplayString as q, normalizeClass as F } from "vue";
+import { H as l } from "../vendor/highlight.js/es/core.es.js";
+import { j as J } from "../vendor/highlight.js/es/languages/javascript.es.js";
+import { j as R } from "../vendor/highlight.js/es/languages/json.es.js";
+import { t as U } from "../vendor/highlight.js/es/languages/typescript.es.js";
+import { v as A } from "../vendor/highlight.js/es/languages/vbscript-html.es.js";
+import { _ as G } from "../button/index.es.js";
+const I = { class: "relative w-full overflow-hidden" }, K = ["placeholder"], O = { class: "relative" }, Q = ["innerHTML"], re = /* @__PURE__ */ T({
+  __name: "CodeSnippet",
+  props: /* @__PURE__ */ H({
+    code: {},
+    lang: { default: "json" },
+    readonly: { type: Boolean },
+    placeholder: {}
+  }, {
+    code: { default: "" },
+    codeModifiers: {}
+  }),
+  emits: ["update:code"],
+  setup(g) {
+    l.registerLanguage("javascript", J), l.registerLanguage("typescript", U), l.registerLanguage("json", R), l.registerLanguage("html", A);
+    const L = g, a = S(g, "code"), n = B("preset", {}).codesnippet, j = k(), f = k(), v = w(0), h = w(!1), s = N(() => a.value.split(`
+`).map((i, c) => {
+      const p = l.highlight(i, {
+        language: L.lang
+      }).value;
+      return {
+        line: c + 1,
+        code: p
+      };
+    })), M = () => {
+      var e;
+      (e = navigator.clipboard) == null || e.writeText(a.value), h.value = !0, setTimeout(() => {
+        h.value = !1;
+      }, 1500);
+    };
+    P(() => {
+      y();
+    });
+    const y = () => {
+      if (f.value) {
+        const e = f.value.querySelector(
+          "[data-wv-section=linenumber]"
+        );
+        v.value = e.offsetWidth;
+      }
+    };
+    return V(s, () => {
+      y();
+    }), (e, i) => {
+      var c, p, b;
+      return r(), d("div", I, [
+        a.value.length && e.readonly ? (r(), $(G, u({ key: 0 }, (c = m(n)) == null ? void 0 : c.copybutton, {
+          icon: h.value ? "check" : "file-copy",
+          onClick: M,
+          size: "small",
+          text: ""
+        }), null, 16, ["icon"])) : x("", !0),
+        o("div", u((p = m(n)) == null ? void 0 : p.body, { style: { "scrollbar-width": "none" } }), [
+          e.readonly ? x("", !0) : z((r(), d("textarea", u({
+            key: 0,
+            ref_key: "textarea",
+            ref: j
+          }, (b = m(n)) == null ? void 0 : b.textarea, {
+            "onUpdate:modelValue": i[0] || (i[0] = (t) => a.value = t),
+            placeholder: e.placeholder,
+            spellcheck: !1,
+            style: `left: ${v.value}px; width: calc(100% - ${v.value + 6}px); scrollbar-width: none;`
+          }), null, 16, K)), [
+            [D, a.value]
+          ]),
+          o("table", {
+            ref_key: "codesnippet",
+            ref: f,
+            class: "relative"
+          }, [
+            o("tbody", O, [
+              (r(!0), d(E, null, W(s.value, ({ line: t, code: C }) => {
+                var _;
+                return r(), d("tr", {
+                  key: t,
+                  class: "h-5"
+                }, [
+                  o("td", u({ ref_for: !0 }, (_ = m(n)) == null ? void 0 : _.linenumber, {
+                    class: [
+                      {
+                        "pt-1.5": t === 1,
+                        "pb-1.5": t === s.value.length
+                      }
+                    ],
+                    "data-wv-section": "linenumber"
+                  }), q(t), 17),
+                  o("td", {
+                    class: F([
+                      "px-1.5",
+                      {
+                        "pt-1.5": t == 1,
+                        "pb-1.5": t === s.value.length
+                      }
+                    ])
+                  }, [
+                    o("pre", {
+                      innerHTML: C,
+                      class: "font-poppins"
+                    }, null, 8, Q)
+                  ], 2)
+                ]);
+              }), 128))
+            ])
+          ], 512)
+        ], 16)
+      ]);
+    };
+  }
+});
+export {
+  re as _
+};

package/codesnippetadapter/index.es.js

@@ -0,0 +1,26 @@
+import { defineComponent as n, ref as d, watch as p, createBlock as s, openBlock as c, unref as l, withCtx as i, createVNode as u } from "vue";
+import { n as m, N as f } from "../vendor/@tiptap/vue-3/dist/index.es.js";
+import { _ } from "../codesnippet/index.es.js";
+const x = /* @__PURE__ */ n({
+  __name: "CodeSnippetAdapter",
+  props: m,
+  setup(r) {
+    const o = r, e = d(o.node.attrs.code);
+    return p(e, () => {
+      o.updateAttributes({ code: e.value });
+    }), (w, t) => (c(), s(l(f), null, {
+      default: i(() => [
+        u(_, {
+          code: e.value,
+          "onUpdate:code": t[0] || (t[0] = (a) => e.value = a),
+          readonly: !o.editor.isEditable,
+          placeholder: "Masukan Code"
+        }, null, 8, ["code", "readonly"])
+      ]),
+      _: 1
+    }));
+  }
+});
+export {
+  x as _
+};

package/columnlist/index.es.js

@@ -0,0 +1,204 @@
+import { reactive as P, defineComponent as _, mergeModels as q, useModel as U, ref as F, shallowRef as J, computed as M, watch as K, createElementBlock as x, openBlock as y, Fragment as B, renderList as T, createCommentVNode as z, mergeProps as I, withModifiers as g, createVNode as E } from "vue";
+import { _ as G } from "../checkbox/index.es.js";
+import { _ as H } from "../icon/index.es.js";
+import { c as Q } from "../vendor/lodash-es/cloneDeep.es.js";
+const W = (o, u, l) => {
+  if (u && l > u) {
+    let r = 0;
+    return o.map((n) => {
+      const c = u !== void 0 && r < u, d = n.checkedByDefault !== !1 && u === void 0 || n.checkedByDefault !== !1 && c;
+      return d && r++, {
+        ...n,
+        visible: d
+      };
+    });
+  }
+  return o;
+}, b = "tableConfigs", X = () => "user-" + (JSON.parse(localStorage.getItem("user") ?? "{}")._id ?? "unknown"), A = async () => {
+  let o = null;
+  return new Promise((u) => {
+    const l = indexedDB.open(X(), 1);
+    l.onupgradeneeded = (r) => {
+      o = r.target.result, o.createObjectStore(b);
+    }, l.onsuccess = (r) => {
+      o = r.target.result, u(o);
+    };
+  });
+}, Y = async () => {
+  const l = (await A()).transaction(b, "readonly").objectStore(b);
+  return new Promise((r) => {
+    let n, c;
+    l.getAllKeys().onsuccess = (d) => {
+      n = d.target.result;
+    }, l.getAll().onsuccess = (d) => {
+      c = d.target.result;
+      const v = {};
+      n.forEach((m, p) => {
+        v[m] = c[p];
+      }), r(v);
+    };
+  });
+}, h = P({}), Z = async () => {
+  const o = async (u, l) => {
+    h[u] = l, (await A()).transaction(b, "readwrite").objectStore(b).put(l, u);
+  };
+  return Object.assign(h, await Y()), {
+    config: h,
+    setConfig: o
+  };
+}, ee = ["id", "data-item-dragable", "draggable", "onDragenter", "onDragstart"], se = /* @__PURE__ */ _({
+  __name: "ColumnList",
+  props: /* @__PURE__ */ q({
+    tableId: {},
+    defaultColumns: {},
+    visibleColumns: {},
+    maxColumn: {},
+    type: {},
+    savedColumns: {}
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(o, { expose: u }) {
+    const l = o, r = U(o, "modelValue"), n = F([]), c = J(), d = M(() => [...n.value].filter((a) => a.visible !== !1)), v = M(() => l.maxColumn ? d.value.length >= l.maxColumn : !1), m = (a) => a.dragable !== !1 && p(a), p = (a) => {
+      if (!v.value) return !0;
+      const t = r.value.findIndex((e) => e.field === a.field) > 0;
+      return v.value && t;
+    }, S = () => {
+      n.value = W(
+        n.value,
+        l.maxColumn,
+        d.value.length
+      ), r.value = [...d.value];
+    }, C = async () => {
+      const a = n.value.map(
+        (e) => ({
+          field: e.field,
+          width: e.width ?? "max-content",
+          visible: e.visible !== !1,
+          fixed: !!e.fixed
+        })
+      ), { setConfig: t } = await Z();
+      await t(l.tableId, a);
+    }, N = () => {
+      r.value = [...n.value];
+    }, R = (a, t, e) => {
+      const { dataTransfer: i } = a;
+      c.value = t, i && (i.dropEffect = "move", i.effectAllowed = "move", i.setData("field", t.field), i.setData("index", e.toString()));
+    }, L = async () => {
+      c.value = void 0, N(), await C();
+    }, j = (a, t) => {
+      var e, i;
+      if (a.preventDefault(), m(t)) {
+        const f = a.target, s = f.tagName === "LI" ? f : f.closest("li");
+        if (s == null || s.classList.add("bg-primary-50"), (e = s == null ? void 0 : s.nextElementSibling) == null || e.classList.remove("bg-primary-50"), (i = s == null ? void 0 : s.previousElementSibling) == null || i.classList.remove("bg-primary-50"), !s || !c.value) return;
+        const D = n.value.findIndex(
+          (k) => {
+            var V;
+            return k.field === ((V = c.value) == null ? void 0 : V.field);
+          }
+        ), w = n.value.findIndex(
+          (k) => k.field === s.id
+        );
+        D !== -1 && w !== -1 && ([
+          n.value[D],
+          n.value[w]
+        ] = [
+          n.value[w],
+          n.value[D]
+        ]);
+      }
+    }, O = (a) => {
+      const t = a.target.querySelector("label");
+      t && t.click();
+    }, $ = () => {
+      const a = Q(l.defaultColumns);
+      if (l.maxColumn && a.length > l.maxColumn) {
+        let t = 0;
+        n.value = a.map((e) => {
+          const i = l.maxColumn !== void 0 && t < l.maxColumn, f = e.checkedByDefault !== !1 && l.maxColumn === void 0 || e.checkedByDefault !== !1 && i;
+          return f && t++, {
+            ...e,
+            visible: f
+          };
+        });
+      } else
+        n.value = a;
+      r.value = [...d.value], C();
+    };
+    return K(
+      () => l.savedColumns,
+      (a) => {
+        n.value = a ?? [];
+      },
+      { immediate: !0 }
+    ), u({
+      setColumnVisibilityConfig: C,
+      resetToDefault: $,
+      updateVisibleColumnsModel: S
+    }), (a, t) => (y(), x("ul", null, [
+      (y(!0), x(B, null, T(n.value, (e, i) => {
+        var f;
+        return y(), x(B, null, [
+          e.reorderable !== !1 ? (y(), x("li", I(
+            {
+              id: e.field,
+              key: e.field,
+              ref_for: !0
+            },
+            a.$preset.customcolumn.menuitem({
+              props: l,
+              context: { dragable: m(e) }
+            }),
+            {
+              "data-item-dragable": m(e),
+              draggable: m(e),
+              onClick: O,
+              onDragend: L,
+              onDragenter: g((s) => j(s, e), ["prevent"]),
+              onDragleave: t[2] || (t[2] = g(() => {
+              }, ["prevent"])),
+              onDragover: t[3] || (t[3] = g(() => {
+              }, ["prevent"])),
+              onDragstart: (s) => R(s, e, i),
+              onMouseenter: t[4] || (t[4] = (s) => s.target.classList.add("bg-primary-50")),
+              onMouseleave: t[5] || (t[5] = (s) => s.target.classList.remove("bg-primary-50")),
+              "data-wv-section": "custom-column-menu-item"
+            }
+          ), [
+            E(H, I(
+              {
+                onClick: t[0] || (t[0] = g(() => {
+                }, ["stop"])),
+                ref_for: !0
+              },
+              (f = a.$preset.customcolumn) == null ? void 0 : f.dragicon({
+                context: { dragable: m(e) }
+              }),
+              { icon: "dragable-menu" }
+            ), null, 16),
+            E(G, {
+              "aria-label": e.header,
+              disabled: e.fixed,
+              label: e.header,
+              "model-value": e.visible !== !1,
+              selectable: p(e),
+              onClick: t[1] || (t[1] = g(() => {
+              }, ["stop"])),
+              "onUpdate:modelValue": (s) => {
+                e.visible = !!s, S(), C();
+              },
+              class: "!w-full"
+            }, null, 8, ["aria-label", "disabled", "label", "model-value", "selectable", "onUpdate:modelValue"])
+          ], 16, ee)) : z("", !0)
+        ], 64);
+      }), 256))
+    ]));
+  }
+});
+export {
+  se as _,
+  W as s,
+  Z as u
+};

package/{components/comment/Comment.vue.d.ts → comment/index.d.ts}

@@ -1,7 +1,8 @@
 import { JSONContent } from '@tiptap/vue-3';
-import { QueryParams } from '../../components/datatable/DataTable.vue.d';
-import { GetMentionSuggestionResponse } from '../../components/editor/Editor.vue.d';
-import { ClassComponent } from '../../components/ts-helpers.d';
+
+import { QueryParams } from '../datatable';
+import { GetMentionSuggestionResponse } from '../editor';
+import { ClassComponent } from '../ts-helpers.d';
 
 export interface CommentProps {
   /**

package/comment/index.es.js

@@ -0,0 +1,267 @@
+import { defineComponent as H, onMounted as J, shallowRef as g, onUnmounted as Q, ref as S, reactive as W, watch as M, createElementBlock as r, openBlock as i, Fragment as f, createCommentVNode as k, createElementVNode as v, renderList as U, createBlock as T, mergeProps as $, createVNode as a, unref as m, withModifiers as E, normalizeClass as X } from "vue";
+import { CommentServices as y, getImageURL as Y } from "@fewangsit/workspace-api-services";
+import { g as Z } from "../utils/object.util.es.js";
+import { s as d } from "../vendor/primevue/skeleton/skeleton.esm.es.js";
+import { _ as L } from "../button/index.es.js";
+import { _ as ee } from "../editor/index.es.js";
+import { _ as te } from "../image/index.es.js";
+import { _ as oe } from "../inputtext/index.es.js";
+import { _ as P } from "../commentblock/index.es.js";
+const se = { key: 0 }, ne = { key: 1 }, ie = { class: "flex gap-1 items-center" }, re = { class: "flex gap-1 items-start mt-1" }, ae = { class: "w-full" }, ce = {
+  key: 1,
+  class: "mt-2 flex gap-1"
+}, le = {
+  key: 0,
+  class: "mt-2"
+}, me = { key: 1 }, ue = { class: "flex gap-1 items-center" }, Ce = /* @__PURE__ */ H({
+  __name: "Comment",
+  props: {
+    user: {},
+    objectId: {},
+    commentType: {},
+    commentPosition: { default: "below" },
+    useReactions: { type: Boolean, default: !0 },
+    useReplies: { type: Boolean, default: !0 },
+    useTimeStamp: { type: Boolean, default: !0 },
+    useExternalServices: { type: Boolean },
+    data: {},
+    mentionSection: {},
+    search: {}
+  },
+  setup(V) {
+    J(() => {
+      z(), B(), t.mentionSection !== void 0 && (c.value = !1);
+    }), Q(() => {
+      q();
+    });
+    const t = V, c = g(!0), h = g(!1), _ = S(), n = W([]), u = g(!0), C = g(), I = S(), j = S(), l = y.commentSocketIo(), b = () => {
+      c.value = !c.value;
+    }, B = async () => {
+      u.value = !0;
+      try {
+        if (t.useExternalServices && t.data) {
+          n.push(...t.data.data), u.value = !1;
+          return;
+        }
+        const { data: e } = await y.getCommentsByObjectId(
+          t.objectId,
+          {
+            search: t.search
+          }
+        );
+        n.splice(0, n.length), n.push(...e.data), u.value = !1;
+      } catch (e) {
+        console.error(e), u.value = !1;
+      }
+    }, N = async () => {
+      try {
+        h.value = !0, await y.postComments({
+          content: _.value ?? {},
+          objectId: t.objectId,
+          type: t.commentType,
+          mentions: I.value
+        }), b(), _.value = [];
+      } catch (e) {
+        console.error(e);
+      } finally {
+        h.value = !1;
+      }
+    }, z = () => {
+      try {
+        l.on("connect", () => {
+          l.emit("joinRoom", `${t.commentType}_${t.objectId}`), K(), D(), F();
+        });
+      } catch (e) {
+        console.error(e);
+      }
+    }, K = () => {
+      l.on("newComment", (e) => {
+        const o = n.findIndex(
+          (s) => s._id === e.replyToId
+        );
+        o >= 0 ? n[o].replies.push({
+          ...e
+        }) : n.push({
+          ...e,
+          replies: []
+        });
+      });
+    }, D = () => {
+      l.on("commentUpdated", O);
+    }, F = () => {
+      l.on("reactionUpdated", G);
+    }, G = (e) => {
+      const o = n.findIndex(
+        (s) => s._id === e._id
+      );
+      o >= 0 ? n[o].reactions = e.reactions : n.forEach((s, x) => {
+        const p = s.replies.findIndex(
+          (R) => R._id === e._id
+        );
+        p >= 0 && (n[x].replies[p].reactions = e.reactions);
+      });
+    }, O = (e) => {
+      const o = n.findIndex(
+        (s) => s._id === e._id
+      );
+      o >= 0 ? n[o].content = e.content : n.forEach((s, x) => {
+        const p = s.replies.findIndex(
+          (R) => R._id === e._id
+        );
+        p >= 0 && (n[x].replies[p].content = e.content);
+      });
+    }, q = () => {
+      l.emit("leaveRoom"), l.disconnect();
+    }, w = async () => {
+      if (C.value === void 0)
+        try {
+          const { data: e } = await y.getCommentsMention({
+            objectID: t.objectId,
+            type: t.commentType
+          });
+          C.value = e;
+        } catch (e) {
+          console.error(e);
+        }
+      return C.value;
+    }, A = async (e) => {
+      try {
+        const { data: o } = await y.postCommentsUpload({
+          images: [e.image]
+        });
+        e.setImageCb(Y(o.data[0]));
+      } catch (o) {
+        console.error(o);
+      }
+    };
+    return M(c, () => {
+      var e;
+      try {
+        (e = t == null ? void 0 : t.mentionSection) == null || e.call(t, (o) => {
+          var s;
+          c.value = !1, (s = j.value) == null || s.mentionSectionTrigger(o);
+        });
+      } catch (o) {
+        console.error(o);
+      }
+    }), M(
+      () => t.search,
+      () => {
+        B();
+      }
+    ), (e, o) => (i(), r(f, null, [
+      e.commentPosition === "above" ? (i(), r(f, { key: 0 }, [
+        u.value ? (i(), r("div", ne, [
+          v("div", ie, [
+            a(m(d), {
+              shape: "circle",
+              size: "2rem"
+            }),
+            a(m(d), {
+              height: "1rem",
+              width: "10rem"
+            })
+          ]),
+          a(m(d), {
+            class: "ml-[34px]",
+            height: "4rem",
+            width: "10rem"
+          })
+        ])) : (i(), r("div", se, [
+          (i(!0), r(f, null, U(n, (s) => (i(), T(P, $({
+            key: s._id,
+            ref_for: !0
+          }, s, {
+            "comment-type": t.commentType,
+            "fetch-mention-suggestion-function": w,
+            "use-reactions": t.useReactions,
+            "use-replies": t.useReplies,
+            "use-time-stamp": t.useTimeStamp,
+            user: t.user
+          }), null, 16, ["comment-type", "use-reactions", "use-replies", "use-time-stamp", "user"]))), 128))
+        ]))
+      ], 64)) : k("", !0),
+      v("div", re, [
+        a(te, {
+          src: m(Z)(e.user, "profilePicture"),
+          onClick: o[0] || (o[0] = E(() => {
+          }, ["stop"])),
+          rounded: "",
+          size: "small"
+        }, null, 8, ["src"]),
+        v("div", ae, [
+          c.value ? (i(), T(oe, {
+            key: 0,
+            onClick: E(b, ["stop"]),
+            placeholder: "Tulis Komentar"
+          })) : k("", !0),
+          v("div", {
+            class: X(`${c.value ? "opacity-0 !h-0 !w-0 overflow-hidden" : ""}`)
+          }, [
+            a(ee, {
+              ref_key: "editorRef",
+              ref: j,
+              "mentioned-list": I.value,
+              "onUpdate:mentionedList": o[1] || (o[1] = (s) => I.value = s),
+              "model-value": _.value,
+              "onUpdate:modelValue": o[2] || (o[2] = (s) => _.value = s),
+              "fetch-mention-suggestion-function": w,
+              onPostImageLocal: A,
+              placeholder: "Tulis Komentar"
+            }, null, 8, ["mentioned-list", "model-value"])
+          ], 2),
+          c.value ? k("", !0) : (i(), r("div", ce, [
+            a(L, {
+              disabled: h.value,
+              icon: h.value ? "spinner" : void 0,
+              onClick: o[3] || (o[3] = (s) => N()),
+              "icon-class": "animate-spin",
+              "icon-pos": "right",
+              label: "Kirim",
+              severity: "success"
+            }, null, 8, ["disabled", "icon"]),
+            a(L, {
+              onClick: b,
+              label: "Batal",
+              severity: "secondary",
+              text: ""
+            })
+          ]))
+        ])
+      ]),
+      e.commentPosition === "below" ? (i(), r(f, { key: 1 }, [
+        u.value ? (i(), r("div", me, [
+          v("div", ue, [
+            a(m(d), {
+              shape: "circle",
+              size: "2rem"
+            }),
+            a(m(d), {
+              height: "1rem",
+              width: "10rem"
+            })
+          ]),
+          a(m(d), {
+            class: "ml-[34px]",
+            height: "4rem",
+            width: "10rem"
+          })
+        ])) : (i(), r("div", le, [
+          (i(!0), r(f, null, U(n, (s) => (i(), T(P, $({
+            key: s._id,
+            ref_for: !0
+          }, s, {
+            "comment-type": t.commentType,
+            "fetch-mention-suggestion-function": w,
+            "use-reactions": t.useReactions,
+            "use-replies": t.useReplies,
+            user: t.user
+          }), null, 16, ["comment-type", "use-reactions", "use-replies", "user"]))), 128))
+        ]))
+      ], 64)) : k("", !0)
+    ], 64));
+  }
+});
+export {
+  Ce as _
+};