@fewangsit/wangsvue-fats 1.0.1-alpha.5 → 1.0.1-alpha.51

package/username/index.es.js

@@ -0,0 +1,146 @@
+import { defineComponent as A, computed as h, shallowRef as N, ref as H, resolveDirective as I, createElementBlock as u, openBlock as a, mergeProps as i, createBlock as d, withDirectives as M, createCommentVNode as P, withModifiers as F, unref as v, createTextVNode as U, toDisplayString as p, withCtx as R, createElementVNode as k, createVNode as q, normalizeProps as G, Fragment as J } from "vue";
+import { t as K } from "../vendor/single-spa/lib/es2015/esm/single-spa.min.es.js";
+import { u as L } from "../plugins/WangsVue.es.js";
+import { m as Q } from "../utils/mergePropsWithDefaults.util.es.js";
+import { g as _ } from "../utils/object.util.es.js";
+import { f as X } from "../utils/textFormatter.util.es.js";
+import { s as $ } from "../vendor/primevue/skeleton/skeleton.esm.es.js";
+import { _ as Y } from "../icon/index.es.js";
+import { _ as j } from "../image/index.es.js";
+import { _ as Z } from "../overlaypanel/index.es.js";
+const ee = { key: 0 }, me = /* @__PURE__ */ A({
+  __name: "UserName",
+  props: {
+    user: {},
+    fetchDetailOnPanelShow: { type: Boolean, default: !0 },
+    detailUserPath: {},
+    type: {},
+    showUserName: { type: Boolean, default: void 0 },
+    formatUserName: { type: Boolean, default: void 0 },
+    userNameField: {},
+    profilePictureField: {},
+    getUserDetail: {}
+  },
+  setup(z) {
+    const r = z, { locale: E, defaultProps: T } = L("UserName"), n = h(() => Q(r, T)), f = N(!1), s = N(), g = N(!1), w = H(), m = h(
+      () => _(
+        r.user ?? {},
+        n.value.userNameField
+      )
+    ), D = h(() => n.value.formatUserName ? X(m.value) : m.value), W = async () => {
+      var t, e, y;
+      if (!s.value && r.fetchDetailOnPanelShow)
+        try {
+          f.value = !0;
+          const o = await ((y = (e = n.value).getUserDetail) == null ? void 0 : y.call(e, (t = r.user) == null ? void 0 : t._id));
+          s.value = o;
+        } catch (o) {
+          console.error(o);
+        } finally {
+          f.value = !1;
+        }
+      else r.fetchDetailOnPanelShow || (s.value = r.user);
+    };
+    return (t, e) => {
+      const y = I("tooltip");
+      return Object.keys(r.user ?? {}).length < 1 ? (a(), u("span", ee, " - ")) : (a(), u("span", i({
+        key: 1,
+        onClick: e[4] || (e[4] = //@ts-ignore
+        (...o) => {
+          var l, c;
+          return ((l = w.value) == null ? void 0 : l.toggle) && ((c = w.value) == null ? void 0 : c.toggle(...o));
+        })
+      }, t.$preset.username.root, {
+        "data-wv-name": "username",
+        "data-wv-section": "root"
+      }), [
+        n.value.type == "picture" ? (a(), d(j, {
+          key: 0,
+          preview: m.value !== void 0,
+          src: v(_)(
+            r.user ?? {},
+            n.value.profilePictureField
+          ),
+          onClick: e[0] || (e[0] = F((o) => {
+            var l;
+            m.value || (l = w.value) == null || l.toggle(o);
+          }, ["stop"])),
+          rounded: "",
+          size: "small"
+        }, null, 8, ["preview", "src"])) : (a(), d(Y, {
+          key: 1,
+          class: "text-general-300 text-base",
+          icon: "user"
+        })),
+        n.value.showUserName ? M((a(), u("span", i({ key: 2 }, t.$preset.username.displayname({ props: r }), { "data-wv-section": "displayname" }), [
+          U(p(D.value), 1)
+        ], 16)), [
+          [
+            y,
+            D.value === m.value ? void 0 : m.value,
+            void 0,
+            { top: !0 }
+          ]
+        ]) : P("", !0),
+        Object.keys(r.user ?? {}).length > 1 ? (a(), d(Z, {
+          key: 3,
+          ref_key: "miniProfile",
+          ref: w,
+          dismissable: !g.value,
+          onShow: W
+        }, {
+          default: R(() => {
+            var o, l, c, b, B, C, O, S;
+            return [
+              k("div", i(t.$preset.username.panel.contentwrapper, { "data-wv-section": "contentwrapper" }), [
+                k("div", i(t.$preset.username.panel.background, { "data-wv-section": "background" }), null, 16),
+                q(j, {
+                  src: ((o = s.value) == null ? void 0 : o.profilePicture) ?? ((l = s.value) == null ? void 0 : l.profilePictureBig),
+                  width: 60,
+                  onHide: e[1] || (e[1] = (V) => g.value = !1),
+                  onShow: e[2] || (e[2] = (V) => g.value = !0),
+                  class: "w-[60px] h-[60px]",
+                  rounded: ""
+                }, null, 8, ["src"]),
+                f.value ? (a(), d(v($), {
+                  key: 1,
+                  height: "29px",
+                  width: "100px"
+                })) : (a(), u("div", G(i({ key: 0 }, t.$preset.username.panel.detailwrapper)), [
+                  k("h4", i(t.$preset.username.panel.username, { "data-wv-section": "username" }), [
+                    U(p((c = s.value) == null ? void 0 : c.fullName) + " ", 1),
+                    (b = s.value) != null && b.nickName ? (a(), u(J, { key: 0 }, [
+                      U(" (" + p((B = s.value) == null ? void 0 : B.nickName) + ") ", 1)
+                    ], 64)) : P("", !0)
+                  ], 16),
+                  k("span", i(t.$preset.username.panel.useremail, { "data-wv-section": "useremail" }), p((C = s.value) == null ? void 0 : C.email), 17)
+                ], 16)),
+                f.value ? (a(), d(v($), {
+                  key: 3,
+                  height: "12px",
+                  width: "60px"
+                })) : (a(), u("span", i({ key: 2 }, t.$preset.username.panel.positiondivision, { "data-wv-section": "positiondivision" }), p((O = s.value) == null ? void 0 : O.division) + " / " + p((S = s.value) == null ? void 0 : S.position), 17)),
+                f.value ? (a(), d(v($), {
+                  key: 5,
+                  width: "75px"
+                })) : (a(), u("a", i({
+                  key: 4,
+                  onClick: e[3] || (e[3] = F((V) => {
+                    var x;
+                    return v(K)(
+                      n.value.detailUserPath.replace("{userId}", (x = r.user) == null ? void 0 : x._id)
+                    );
+                  }, ["stop"]))
+                }, t.$preset.username.panel.userdetaillink, { "data-wv-section": "userdetaillink" }), p(v(E).detailUserAnchorText), 17))
+              ], 16)
+            ];
+          }),
+          _: 1
+        }, 8, ["dismissable"])) : P("", !0)
+      ], 16));
+    };
+  }
+});
+export {
+  me as _
+};

package/{components/userwithicon/UserWithIcon.vue.d.ts → userwithicon/index.d.ts}

@@ -1,6 +1,6 @@
 import { UserDetail } from '@tagsamurai/fats-api-services/src/types/user.type';
 
-import { ClassComponent } from '../../components/ts-helpers.d';
+import { ClassComponent } from '../ts-helpers.d';
 
 export interface UserWithIconProps {
   user: Partial<UserDetail> & { fullName: string };

package/userwithicon/index.es.js

@@ -0,0 +1,18 @@
+import { defineComponent as r, createBlock as o, openBlock as n } from "vue";
+import { _ as s } from "../username/index.es.js";
+const m = /* @__PURE__ */ r({
+  __name: "UserWithIcon",
+  props: {
+    user: {}
+  },
+  setup(p) {
+    return (e, t) => (n(), o(s, {
+      user: e.user,
+      type: "icon",
+      "user-name-field": "fullName"
+    }, null, 8, ["user"]));
+  }
+});
+export {
+  m as _
+};

package/utils/addAttachment.util.es.js

@@ -0,0 +1,10 @@
+const s = (t) => t.startsWith("image/") ? "image" : t.includes("mp4") ? "mp4" : t === "video/x-matroska" ? "mkv" : t === "text/plain" ? "txt" : t === "text/csv" ? "csv" : t === "text/html" ? "html" : t === "application/json" ? "json" : t === "application/pdf" ? "pdf" : t === "application/vnd.ms-excel" || t === "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" ? "xls" : t === "application/msword" || t === "application/vnd.openxmlformats-officedocument.wordprocessingml.document" ? "doc" : t.startsWith("application/x-url") ? "link" : t.includes("application/x-zip-compressed") || t.includes("application/x-compressed") ? "compressed" : "unknown", i = (t, n = 1) => {
+  var o;
+  if (n *= 1048576, !((o = t.type) != null && o.length))
+    return !1;
+  const r = s(t.type);
+  return t.size <= (r === "mp4" || r === "mkv" ? 10485760 : n);
+};
+export {
+  i as v
+};

package/utils/baseToast.util.d.ts

@@ -0,0 +1,120 @@
+import { WangsIcons } from '../icon';
+export type ToastSeverity = 'success' | 'error' | 'info';
+export interface ToastParams {
+  /**
+   * The main message to display in the toast. Will be formatted based on template message.
+   */
+  message: string;
+  /**
+   * Indicates whether the message is customized and does not follow the default message template.
+   * If true, custom formatting will be applied.
+   */
+  customMessage?: boolean;
+  /**
+   * The severity level of the toast message.
+   * Can be 'success', 'error', or 'info'.
+   */
+  severity?: ToastSeverity;
+  /**
+   * The icon to display in the toast.
+   */
+  icon?: WangsIcons;
+  /**
+   * The custom CSS class to apply to the icon.
+   */
+  iconClass?: any;
+  /**
+   * The error object from a catch statement, used to provide additional details for error toasts.
+   * Accepts any type of error object.
+   */
+  error?: unknown;
+  /**
+   * The duration for which the toast will be displayed, in milliseconds.
+   * Set to 0 to show the message infinitely.
+   *
+   * @default 3000 - 3 seconds
+   */
+  life?: number;
+  /**
+   * The name of the message group to which this toast belongs.
+   */
+  group?: string;
+  /**
+   * Unique identifier of the toast message.
+   */
+  messageId?: string;
+}
+export interface ToastMethod {
+  add(params: ToastParams): void;
+  /**
+   * Clears the messages that belongs to the group.
+   * @param {string} group - Name of the message group.
+   */
+  removeGroup(group: string): void;
+  removeAllGroups(): void;
+}
+/**
+ * Configuration options for the `useToast` hook.
+ */
+export interface UseToastConfig {
+  /**
+   * Default message templates for each severity level.
+   * Keys represent the severity, and values are the template strings.
+   *
+   * @example
+   * {
+   *   severity: {
+   *     success: 'Success, {message}',
+   *     error: 'Error, {message} {additionalMessage}',
+   *     info: 'Info, {message} {additionalMessage}',
+   *   },
+   *   additionalMessage: ' Silahkan cek kembali koneksi Anda.'
+   * }
+   */
+  template?: {
+    severity?: Record<string, string>;
+    additionalMessage?: string;
+  };
+  /**
+   * Icons for each severity level.
+   * Keys represent the severity, and values are the corresponding icon identifiers.
+   *
+   * @example
+   * {
+   *   success: 'emotion-happy-fill',
+   *   error: 'emotion-unhappy-fill',
+   * }
+   */
+  icons?: Record<string, WangsIcons>;
+}
+/**
+ * Hook to create and manage toast notifications.
+ *
+ * @param {UseToastConfig} config - Configuration object for the toast notifications.
+ * Refer to {@link UseToastConfig} for the structure and details of this object.
+ *
+ * @returns {ToastMethod} A method to trigger toast notifications.
+ * The method accepts {@link ToastParams} to customize individual notifications.
+ *
+ * @example
+ * const toast = useToast({
+ *   template: {
+ *     success: 'Success, {message}',
+ *     error: 'Error, {message} {additionalMessage}',
+ *     info: 'Info, {message} {additionalMessage}',
+ *   },
+ *   icons: {
+ *     success: 'emotion-happy-fill',
+ *     error: 'emotion-unhappy-fill',
+ *   }
+ * });
+ *
+ * // Overiding the default config with ToastParams
+ * toast.add({
+ *   message: 'Operation completed successfully!',
+ *   customMessage: true,
+ *   icon: 'custom-success-icon',
+ * });
+ */
+declare const useToast: ({ icons, template }?: UseToastConfig) => ToastMethod;
+export default useToast;

package/utils/baseToast.util.es.js

@@ -0,0 +1,44 @@
+import { e as G } from "../event-bus/index.es.js";
+import { u as M } from "../vendor/primevue/usetoast/usetoast.esm.es.js";
+import { u as A } from "../vendor/lodash-es/uniqueId.es.js";
+const w = ({ icons: i, template: r } = {}) => {
+  const t = M();
+  return {
+    add: (e) => {
+      var n, c, f;
+      const {
+        message: a,
+        customMessage: v,
+        error: s,
+        severity: g,
+        life: l,
+        group: d = "default-toast",
+        ...m
+      } = e;
+      let u = "";
+      s instanceof Error && s && s.isAxiosError && (u = s.code === "ERR_NETWORK" ? (r == null ? void 0 : r.additionalMessage) ?? "" : "");
+      const o = s ? "error" : g ?? "success", E = ((f = (c = (n = r == null ? void 0 : r.severity) == null ? void 0 : n[o]) == null ? void 0 : c.replace("{message}", a)) == null ? void 0 : f.replace("{additionalMessage}", u)) || a, y = m.icon ?? (i == null ? void 0 : i[o]);
+      t.add({
+        severity: o,
+        detail: v ? a : E,
+        life: l ?? 3e3,
+        group: d
+      }), G.emit("toast:add", {
+        messageId: A(),
+        ...e,
+        severity: o,
+        group: d,
+        icon: y
+      });
+    },
+    removeGroup: (e) => {
+      t.removeGroup(e);
+    },
+    removeAllGroups: () => {
+      t.removeAllGroups();
+    }
+  };
+};
+export {
+  w as u
+};

package/utils/cookie.util.d.ts

@@ -0,0 +1,18 @@
+type SetCookieOptions = {
+  name: string;
+  value: string;
+  days?: number;
+  path?: string;
+  secure?: boolean;
+  sameSite?: 'Lax' | 'Strict' | 'None';
+};
+export declare const setCookie: ({
+  name,
+  value,
+  days,
+  path,
+  secure,
+  sameSite,
+}: SetCookieOptions) => void;
+export declare const getCookie: (name: string) => string | undefined;
+export {};

package/utils/cookie.util.es.js

@@ -0,0 +1,19 @@
+const a = ({
+  name: t,
+  value: e,
+  days: o = 365,
+  path: n = "/",
+  secure: c = !1,
+  sameSite: i
+}) => {
+  const r = new Date(Date.now() + o * 864e5).toUTCString();
+  let s = `${t}=${e}; expires=${r}; path=${n}`;
+  c && (s += "; Secure"), i && (s += `; SameSite=${i}`), document.cookie = s;
+}, p = (t) => {
+  const e = document.cookie.split("; ").find((o) => o.startsWith(`${t}=`));
+  return e == null ? void 0 : e.split("=")[1];
+};
+export {
+  p as g,
+  a as s
+};

package/utils/date.util.d.ts

@@ -40,7 +40,7 @@ export type DateOptions = {
   /**
    * Show the time in the formatted date.
    *
-   * @default true - when `timeFormat` is provided
+   * @default false - But will be set to true when `DateOptions.timeFormat` is provided
    */
   showTime?: boolean;
   /**
@@ -71,9 +71,22 @@ export declare const formatDateReadable: (
   date: Date,
   maxSeconds?: number,
 ) => string;
+/**
+ * A better "formatDateReadable"
+ * @param date
+ * @param maxSeconds
+ * @param lang
+ * @returns
+ */
+export declare const formatTimeAgo: (
+  date: Date,
+  maxSeconds?: number,
+  lang?: string,
+) => string;
 export declare const getRemainingTime: (deadline: string) => {
   seconds: number;
   days: number;
   hours: number;
   minutes: number;
 };
+export declare const isISODateString: (value: string) => boolean;

package/utils/date.util.es.js

@@ -0,0 +1,230 @@
+const p = () => {
+  const { consoleSettings: o, generalSetting: i } = JSON.parse(
+    localStorage.getItem("user") ?? "{}"
+  ), { dateFormat: r, timeFormat: a, timezone: t } = o ?? i ?? {};
+  let d = {};
+  return !r || a === null || !t ? {} : (typeof r == "string" ? d = {
+    dateFormat: r,
+    timeFormat: a,
+    timezone: t
+  } : d = {
+    formatPreset: {
+      ...r,
+      weekday: r != null && r.weekday ? r.weekday : void 0,
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit",
+      hour12: a,
+      timezone: t
+    }
+  }, d);
+}, F = (o, i, r = !0) => {
+  const a = {
+    locale: "en-gb",
+    dateFormat: "dd/mm/yy",
+    timeFormat: "HH:mm"
+  }, t = r ? p() : null;
+  i ?? (i = {});
+  const {
+    showDate: d = !0,
+    showTime: n = !1,
+    dateFormat: y = (t == null ? void 0 : t.dateFormat) ?? a.dateFormat,
+    // Here dateFormat will use: guven options, then generalSettings, lastly the default
+    timezone: c = (t == null ? void 0 : t.timezone) ?? a.timezone
+    // Here timeFormat will use: given options, then generalSettings, lastly the default
+  } = i;
+  let {
+    locale: m = (t == null ? void 0 : t.locale) ?? a.locale,
+    timeFormat: s = (t == null ? void 0 : t.timeFormat) ?? a.timeFormat
+  } = i;
+  if (t != null && t.formatPreset) {
+    const {
+      locale: l,
+      timezone: g,
+      hour: h,
+      minute: f,
+      second: M,
+      hour12: D,
+      ...k
+    } = t.formatPreset, b = n ? { hour: h, minute: f, second: M, hour12: D } : {};
+    return o.toLocaleString(l, {
+      ...g ? { timeZone: g } : {},
+      ...k,
+      ...b
+    }).replace(/\b(am|pm)\b/g, (w) => w.toUpperCase());
+  }
+  let e = {
+    ...c ? { timeZone: c } : {}
+  };
+  if (d)
+    switch (y) {
+      case "d/m/yy":
+      case "_2/_1/06":
+        e = {
+          ...e,
+          year: "2-digit",
+          month: "numeric",
+          day: "numeric"
+        }, m = "id-id";
+        break;
+      case "m/d/yy":
+      case "_1/_2/06":
+        e = {
+          ...e,
+          year: "2-digit",
+          month: "numeric",
+          day: "numeric"
+        }, m = "en-us";
+        break;
+      case "d/mm/yy":
+        e = {
+          ...e,
+          year: "2-digit",
+          month: "2-digit",
+          day: "numeric"
+        };
+        break;
+      case "dd/mm/yyyy":
+        e = {
+          ...e,
+          year: "numeric",
+          month: "2-digit",
+          day: "2-digit"
+        };
+        break;
+      case "dd M yy":
+      case "02 Jan 06":
+        e = {
+          ...e,
+          year: "2-digit",
+          month: "short",
+          day: "2-digit"
+        };
+        break;
+      case "dd M yyyy":
+        e = {
+          ...e,
+          year: "numeric",
+          month: "short",
+          day: "2-digit"
+        };
+        break;
+      case "dd MM yy":
+        e = {
+          ...e,
+          year: "2-digit",
+          month: "long",
+          day: "2-digit"
+        };
+        break;
+      case "dd MM yyyy":
+        e = {
+          ...e,
+          year: "numeric",
+          month: "long",
+          day: "2-digit"
+        };
+        break;
+      case "D dd M yy":
+      case "D, dd M yy":
+      case "Mon, 02 Jan 06":
+        e = {
+          ...e,
+          weekday: "short",
+          year: "2-digit",
+          month: "short",
+          day: "2-digit"
+        };
+        break;
+      case "D dd M yyyy":
+      case "D, dd M yyyy":
+      case "Mon, 02 Jan 2006":
+        e = {
+          ...e,
+          weekday: "short",
+          year: "numeric",
+          month: "short",
+          day: "2-digit"
+        };
+        break;
+      case "DD dd MM yy":
+      case "DD, dd MM yy":
+        e = {
+          ...e,
+          weekday: "long",
+          year: "2-digit",
+          month: "long",
+          day: "2-digit"
+        };
+        break;
+      case "DD dd MM yyyy":
+      case "DD, dd MM yyyy":
+        e = {
+          ...e,
+          weekday: "long",
+          year: "numeric",
+          month: "long",
+          day: "2-digit"
+        };
+        break;
+      case "02/01/06":
+      default:
+        e = {
+          ...e,
+          year: "2-digit",
+          month: "2-digit",
+          day: "2-digit"
+        };
+        break;
+    }
+  if (n && !s && (s = "HH:mm"), n || i.timeFormat)
+    switch (s) {
+      case "HH:mm":
+      case "HH:mm a":
+      case "15:04":
+      case "03:04 PM":
+        e = {
+          ...e,
+          hour: "2-digit",
+          minute: "2-digit",
+          hour12: s.includes("a") || s.includes("PM")
+        };
+        break;
+      case "HH:mm:ss":
+      case "HH:mm:ss a":
+      case "15:04:05":
+      case "03:04:05 PM":
+        e = {
+          ...e,
+          hour: "2-digit",
+          minute: "2-digit",
+          second: "2-digit",
+          hour12: s.includes("a") || s.includes("PM")
+        };
+        break;
+    }
+  let u = y.includes(",") ? o.toLocaleString(m, e) : o.toLocaleString(m, e).replace(",", "");
+  return u = u.replace(/\./g, ":"), u.replace(/\b(am|pm)\b/g, (l) => l.toUpperCase());
+}, P = (o) => (
+  // Use Sweden locale, which uses ISO 8601 format: https://stackoverflow.com/a/58633651/27534858
+  new Date(o).toLocaleString("sv")
+), T = (o, i, r = "en") => {
+  const a = Math.floor((Date.now() - o.getTime()) / 1e3);
+  if (i && a > i)
+    return F(o);
+  const t = [
+    [Math.floor(a / 31536e3), "year"],
+    [Math.floor(a / 2628e3), "month"],
+    [Math.floor(a / 86400), "day"],
+    [Math.floor(a / 3600), "hour"],
+    [Math.floor(a / 60), "minute"],
+    [a, "second"]
+  ], [d, n] = t.find(([m]) => m > 0) ?? [0, "second"], c = new Intl.RelativeTimeFormat(r, { numeric: "auto" }).format(-d, n);
+  return r === "id" && c.trim().toLowerCase() === "sekarang" ? "baru saja" : c;
+}, L = (o) => typeof o == "string" && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(?:\.\d+)?Z$/.test(o) && !isNaN(Date.parse(o));
+export {
+  P as a,
+  T as b,
+  F as f,
+  L as i
+};

package/utils/exportToExcel.util.d.ts

@@ -1,9 +1,5 @@
-import { ButtonDownloadLocaleConfig } from '../components/buttondownload/ButtonDownload.vue.d';
-import {
-  Data,
-  DataTableLocaleConfig,
-  TableColumn,
-} from '../components/datatable/DataTable.vue.d';
+import { ButtonDownloadLocaleConfig } from '../buttondownload';
+import { Data, DataTableLocaleConfig, TableColumn } from '../datatable';
 import { LocaleConfig } from '../plugins/WangsVue';
 export interface ITable {
   headers: string[];