@cling-se/widget 1.0.0-beta.1 → 1.0.0-beta.3

package/dist/DocAnswer-BEsvAMEp.js

@@ -0,0 +1,33 @@
+import n from "./AnswerModal-Dc3cgkap.js";
+import { _ as t, b as c, o as r, c as s } from "./main-C4OdoeS2.js";
+const u = {
+  components: {
+    AnswerModal: n
+  },
+  props: {
+    document: {
+      type: Object,
+      required: !0
+    },
+    answerType: {
+      type: String,
+      required: !0
+    },
+    closeFunc: {
+      type: Function,
+      default: null
+    }
+  }
+};
+function a(d, l, e, m, p, _) {
+  const o = c("AnswerModal");
+  return r(), s(o, {
+    mode: e.answerType,
+    _document: e.document,
+    onClose: e.closeFunc
+  }, null, 8, ["mode", "_document", "onClose"]);
+}
+const w = /* @__PURE__ */ t(u, [["render", a]]);
+export {
+  w as default
+};

package/dist/DocDetails--LO0-S5d.js

@@ -0,0 +1,448 @@
+import { D as L } from "./DocumentVoided-CgDt-JFI.js";
+import { C as F, a as A, w as I } from "./CDropdownItem-DvaU14-V.js";
+import { _ as $, b7 as B, S as z, aa as N, b as f, o as n, d as s, s as i, F as g, k as C, l as S, v as o, f as a, c as w, w as v, e as D, B as x, b8 as V, b9 as R, aK as j, ba as q } from "./main-C4OdoeS2.js";
+import { C as O } from "./CPhoneFormat-BBQ_UIc_.js";
+const E = {
+  name: "PublicDocumentEvents",
+  props: {
+    document: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  computed: {
+    events() {
+      const t = [], { acceptedAt: c } = this.document;
+      return this.document.events.filter(({ createdAt: e }) => c ? B(c, e) : !0).forEach((e) => {
+        const { code: p, createdAt: r, children: m = [] } = e;
+        let { data: h = {} } = e;
+        h === null && (h = {});
+        const { client: d = {}, clients: b = [], status: _, counter: y } = h, l = {
+          sent: () => b.map((u) => {
+            const k = this.getClientName(u.id), P = this.filteredOxfordComma([
+              u.email,
+              u.cellphone
+            ]);
+            return {
+              text: this.document.$t("event.sent", {
+                to: `${k ? k + ", " : ""}${P}`
+              }),
+              time: r
+            };
+          }),
+          viewed: () => {
+            const u = y || m.length + 1;
+            return [
+              {
+                text: `${this.document.$t(
+                  `event.${d.name ? "viewedName" : "viewed"}`,
+                  { name: d.name }
+                )} ${u ? this.document.$tc("times", { count: u }) : ""}.`,
+                time: r
+              }
+            ];
+          },
+          accepted: () => [
+            {
+              text: this.document.$t("event.accepted", {
+                by: d.name || d.email || d.cellphone
+              }),
+              time: r
+            }
+          ],
+          denied: () => [
+            {
+              text: this.document.$t("event.denied", {
+                by: d.name || d.email || d.cellphone
+              }),
+              time: r
+            }
+          ],
+          statusChanged: () => [
+            {
+              text: this.document.$t("event.statusChanged", {
+                status: this.document.$t(`status.${_}`).toLowerCase()
+              }),
+              time: r
+            }
+          ],
+          requestChange: () => [
+            {
+              text: this.document.$t("event.requestChange", {
+                status: this.document.$t(`status.${_}`).toLowerCase()
+              }),
+              time: r
+            }
+          ],
+          expired: () => [
+            {
+              text: this.document.$t("event.expired"),
+              time: r
+            }
+          ]
+        };
+        l[p] && t.push(...l[p]());
+      }), t;
+    }
+  },
+  methods: {
+    filteredOxfordComma(t = []) {
+      const c = t.filter((p) => !!p), e = c.length;
+      return e ? e < 2 ? c[0] : `${c.slice(0, -1).join(", ")} ${this.document.$t("and")} ${c.slice(
+        -1
+      )}` : "";
+    },
+    getClientName(t) {
+      const c = this.document.clients.find(({ id: e }) => e === t);
+      return c ? c.name : "";
+    }
+  }
+};
+function T(t, c, e, p, r, m) {
+  return z(t.$slots, "default", { events: m.events });
+}
+const M = /* @__PURE__ */ $(E, [["render", T]]), U = {
+  name: "PublicRecipientItem",
+  i18nOptions: {
+    namespaces: "components",
+    keyPrefix: "document.myPagesDrawer"
+  },
+  components: {
+    CPhoneFormat: O
+  },
+  props: {
+    recipient: {
+      type: Object,
+      required: !0
+    }
+  },
+  methods: {
+    get: N,
+    getBrowserString({ browser: t, os: c, device: e }) {
+      return [t && t.name, c && c.name, e && e.model].filter((p) => !!p).join(", ");
+    }
+  }
+}, K = { style: { border: "1px solid hsl(0, 0%, 84%)", "border-radius": "3px", "margin-bottom": "1em" } }, W = { style: { padding: "0.5em 0.75em" } }, G = {
+  class: "flex w-full flex-col",
+  style: { "font-size": "14px", "align-items": "baseline" }
+}, H = ["href"], J = ["href"], Q = { style: { "background-color": "hsl(0, 0%, 94%)", padding: "0.75em 0.75em", "font-weight": "500", "font-size": "13px", "line-height": "1", color: "hsl(0, 0%, 40%)", position: "relative" } }, X = { style: { position: "absolute", right: "1em", top: "0px", transform: "translate(0, -50%)" } }, Y = {
+  key: 0,
+  style: { padding: "5px 0.75em", background: "hsl(0, 0%, 60%)", "border-radius": "4px", "font-size": "13px", color: "hsl(0, 0%, 100%)", cursor: "default", display: "inline-flex", "align-items": "center" }
+}, Z = { style: { padding: "0" } }, ee = { style: { padding: "1em 1.5em" } }, te = {
+  key: 0,
+  style: { "padding-bottom": "0.5em" }
+}, ne = {
+  class: "has-text-grey",
+  style: { "padding-bottom": "1em" }
+}, ie = ["src"], oe = {
+  key: 1,
+  style: { "font-size": "13px", "padding-top": "3px" }
+}, se = { style: { "font-weight": "500" } }, ce = {
+  key: 1,
+  style: { "font-weight": "500" }
+}, ae = { key: 1 }, de = { key: 2 }, le = {
+  key: 0,
+  style: { padding: "8px 1.5em", "border-top": "1px solid hsl(0deg 0% 88%)", "background-color": "hsl(0deg 0% 95%)", "font-size": "13px", color: "hsl(0, 0%, 35%)", "font-weight": "500" }
+}, re = { key: 0 }, ue = { key: 1 }, me = { key: 2 };
+function he(t, c, e, p, r, m) {
+  const h = f("CPhoneFormat"), d = f("CIcon"), b = f("VDropdown");
+  return n(), s("div", K, [
+    i("div", W, [
+      (n(!0), s(g, null, C([
+        e.recipient.name,
+        e.recipient.companyName,
+        e.recipient.orgNo
+      ], (_, y) => (n(), s("span", {
+        key: `${_}-${y}`,
+        style: S(y === 0 ? { fontWeight: 500 } : { opacity: 0.65 })
+      }, o(_ && y > 0 ? "·" : "") + " " + o(_), 5))), 128)),
+      i("div", G, [
+        e.recipient.email ? (n(), s("a", {
+          key: 0,
+          href: `mailto:${e.recipient.email}`,
+          target: "_blank"
+        }, o(e.recipient.email), 9, H)) : a("", !0),
+        e.recipient.cellphone ? (n(), w(h, {
+          key: 1,
+          phone: e.recipient.cellphone,
+          region: e.recipient.cellphoneRegion
+        }, {
+          default: v(({ formattedValue: _ }) => [
+            i("a", {
+              href: `tel:${e.recipient.cellphone}`
+            }, o(_), 9, J)
+          ]),
+          _: 1
+        }, 8, ["phone", "region"])) : a("", !0)
+      ])
+    ]),
+    i("div", Q, [
+      i("div", null, o(t.$t(`_common:documentRole.${e.recipient.documentRole}.label`)), 1),
+      i("div", X, [
+        D(b, {
+          "popper-class": "signee-popover",
+          triggers: ["hover"],
+          placement: "bottom-end"
+        }, {
+          popper: v(() => [
+            i("div", Z, [
+              i("div", ee, [
+                e.recipient.answer && e.recipient.answer.didAccept ? (n(), s(g, { key: 0 }, [
+                  e.recipient.answer.signatureDataURL ? (n(), s("div", te, [
+                    i("div", ne, o(t.$t("_common:signature").capitalize()), 1),
+                    i("img", {
+                      src: e.recipient.answer.signatureDataURL,
+                      style: { width: "80%" }
+                    }, null, 8, ie)
+                  ])) : (n(), s("div", oe, [
+                    m.get(e.recipient, "answerMethod.accept") === "bankId" ? (n(), s(g, { key: 0 }, [
+                      i("div", se, o(t.$t(
+                        "views:publicDocument.pdfVerification.recipient.signedBankId"
+                      )), 1),
+                      i("div", null, o(e.recipient.answer.response.name), 1),
+                      i("div", null, o(e.recipient.socialNo), 1)
+                    ], 64)) : m.get(e.recipient, "answerMethod.accept") === "login" ? (n(), s("div", ce, o(t.$t(
+                      "views:publicDocument.pdfVerification.recipient.verifiedLogin"
+                    )), 1)) : a("", !0)
+                  ]))
+                ], 64)) : e.recipient.answer ? (n(), s("div", ae, o(t.$t("_common:denied").capitalize()), 1)) : (n(), s("div", de, o(t.$t("pendingAnswer")), 1))
+              ]),
+              e.recipient.answer ? (n(), s("div", le, [
+                e.recipient.answer.didAnswerAt ? (n(), s("div", re, [
+                  i("div", null, o(t.$t("_common:date").capitalize()) + ": " + o(t.$formatDate(e.recipient.answer.didAnswerAt, "P")), 1),
+                  i("div", null, o(t.$t("_common:time").capitalize()) + ": " + o(t.$formatDate(e.recipient.answer.didAnswerAt, "p")), 1)
+                ])) : a("", !0),
+                e.recipient.answer.ip ? (n(), s("div", ue, " IP: " + o(e.recipient.answer.ip), 1)) : a("", !0),
+                e.recipient.answer.browser ? (n(), s("div", me, " Browser: " + o(m.getBrowserString(e.recipient.answer)), 1)) : a("", !0)
+              ])) : a("", !0)
+            ])
+          ]),
+          default: v(() => [
+            e.recipient.documentRole === "signee" ? (n(), s("div", Y, [
+              D(d, {
+                size: 15,
+                type: "info",
+                style: { "margin-right": "0.5ch" },
+                "stroke-width": "2"
+              }),
+              e.recipient.answer && e.recipient.answer.didAccept ? (n(), s(g, { key: 0 }, [
+                x(o(t.$t("_common:approved").capitalize()), 1)
+              ], 64)) : e.recipient.answer ? (n(), s(g, { key: 1 }, [
+                x(o(t.$t("_common:denied").capitalize()), 1)
+              ], 64)) : (n(), s(g, { key: 2 }, [
+                x(o(t.$t("views:publicDocument.pdfVerification.waitingForAnswer")), 1)
+              ], 64))
+            ])) : a("", !0)
+          ]),
+          _: 1
+        })
+      ])
+    ])
+  ]);
+}
+const pe = /* @__PURE__ */ $(U, [["render", he], ["__scopeId", "data-v-f0bf3dd6"]]), _e = {
+  name: "DocumentDetails",
+  components: {
+    PublicDocumentEvents: M,
+    PublicRecipientItem: pe,
+    CDropdown: F,
+    CDropdownItem: A
+  },
+  mixins: [I],
+  props: {
+    document: {
+      type: Object,
+      required: !0
+    },
+    openPrintFunc: {
+      type: Function,
+      default: null
+    },
+    showLanguageSelect: {
+      type: Boolean,
+      default: !0
+    },
+    close: {
+      type: Function,
+      default: null
+    }
+  },
+  data() {
+    return {
+      docLanguages: V,
+      nativeTranslations: R
+    };
+  },
+  computed: {
+    viewer() {
+      return this.document.viewer;
+    },
+    showActionNav() {
+      return !!(this.openPrintFunc || this.showLanguageSelect || this.close);
+    }
+  },
+  methods: {
+    changeLanguage(t) {
+      this.document.language = t, j.changeLanguage(q.includes(t) ? t : "en");
+    }
+  }
+}, ge = { class: "relative flex h-full w-full flex-col overflow-hidden rounded-lg bg-white text-base" }, fe = {
+  key: 0,
+  class: "z-10 flex w-full items-center justify-end px-6 py-4 shadow-sm"
+}, ve = { class: "d-root h-full min-h-0 flex-1 overflow-auto px-6 py-8 md:px-12 md:py-16" }, ye = { class: "mb-[3em] flex justify-between" }, we = { style: { "font-size": "18px", "font-weight": "600" } }, be = {
+  class: "has-text-grey",
+  style: { "font-size": "14px" }
+}, ke = {
+  class: "d-option",
+  style: { "margin-bottom": "3em" }
+}, De = {
+  class: "d-option-title",
+  style: { "padding-bottom": "0.5rem" }
+}, xe = {
+  key: 0,
+  class: "d-option"
+}, Ce = { class: "d-option-title" }, $e = { id: "timeline" }, ze = { class: "e-data" }, Pe = { class: "e-text" }, Le = { class: "e-timestamp" }, Fe = { class: "e-date" }, Ae = {
+  class: "e-time",
+  style: { "padding-left": "0.5ch" }
+}, Ie = { key: 0 }, Be = { key: 1 };
+function Ne(t, c, e, p, r, m) {
+  const h = f("CButton"), d = f("CDropdownItem"), b = f("CDropdown"), _ = f("PublicRecipientItem"), y = f("PublicDocumentEvents");
+  return n(), s("div", ge, [
+    m.showActionNav ? (n(), s("div", fe, [
+      e.openPrintFunc ? (n(), s(g, { key: 0 }, [
+        D(h, {
+          "icon-left": "print",
+          type: "none",
+          pattern: "tertiary",
+          taller: "",
+          size: "small",
+          style: { "padding-left": "1em", "padding-right": "1em" },
+          onClick: e.openPrintFunc
+        }, {
+          default: v(() => [
+            x(o(e.document.$t("download", { thing: "PDF" })), 1)
+          ]),
+          _: 1
+        }, 8, ["onClick"]),
+        c[0] || (c[0] = i("div", { style: { height: "2rem", width: "1px", "background-color": "hsl(0, 0%, 88%)", margin: "0 6px" } }, null, -1))
+      ], 64)) : a("", !0),
+      e.showLanguageSelect ? (n(), w(b, {
+        key: 1,
+        "model-value": e.document.language
+      }, {
+        trigger: v(() => [
+          D(h, {
+            "icon-props": { size: 18 },
+            size: "normal",
+            icon: "globe",
+            circle: "",
+            style: { color: "hsla(0, 0%, 45%, 1)" }
+          })
+        ]),
+        default: v(() => [
+          (n(!0), s(g, null, C(r.docLanguages, (l) => (n(), w(d, {
+            key: l,
+            value: l,
+            onClick: (u) => m.changeLanguage(l)
+          }, {
+            default: v(() => [
+              x(o(r.nativeTranslations[l]), 1)
+            ]),
+            _: 2
+          }, 1032, ["value", "onClick"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["model-value"])) : a("", !0),
+      e.close ? (n(), w(h, {
+        key: 2,
+        "icon-props": { size: 18 },
+        size: "normal",
+        icon: "x",
+        circle: "",
+        style: { "margin-left": "6px", color: "hsla(0, 0%, 45%, 1)" },
+        onClick: e.close
+      }, null, 8, ["onClick"])) : a("", !0)
+    ])) : a("", !0),
+    i("div", ve, [
+      i("div", ye, [
+        i("div", null, [
+          i("div", we, o(e.document.$t("detail_plural").capitalize()), 1),
+          i("div", be, o(e.document.$t("documentDetails.subTitle")), 1)
+        ])
+      ]),
+      i("div", ke, [
+        i("div", De, o(e.document.$t("participant_plural").capitalize()), 1),
+        (n(!0), s(g, null, C(e.document.recipients, (l, u) => (n(), w(_, {
+          key: l._uniqueId + u,
+          recipient: l
+        }, null, 8, ["recipient"]))), 128))
+      ]),
+      D(y, { document: e.document }, {
+        default: v(({ events: l }) => [
+          l && l.length ? (n(), s("div", xe, [
+            i("div", Ce, o(e.document.$t("event.event_plural").capitalize()), 1),
+            i("div", $e, [
+              i("div", null, [
+                (n(!0), s(g, null, C(l, (u, k) => (n(), s("div", {
+                  key: k,
+                  class: "e-item"
+                }, [
+                  i("div", ze, [
+                    i("div", Pe, o(u.text), 1),
+                    i("div", Le, [
+                      i("div", Fe, o(t.$formatDate(u.time, "P")), 1),
+                      i("div", Ae, o(t.$formatDate(u.time, "p")), 1)
+                    ])
+                  ])
+                ]))), 128))
+              ])
+            ])
+          ])) : a("", !0)
+        ]),
+        _: 1
+      }, 8, ["document"]),
+      t.mq === "sm" ? (n(), s("div", Ie, [
+        z(t.$slots, "footer", {}, void 0, !0)
+      ])) : a("", !0)
+    ]),
+    t.mq !== "sm" ? (n(), s("div", Be, [
+      z(t.$slots, "footer", {}, void 0, !0)
+    ])) : a("", !0)
+  ]);
+}
+const Se = /* @__PURE__ */ $(_e, [["render", Ne], ["__scopeId", "data-v-92c179eb"]]), Ve = {
+  components: {
+    DocumentDetails: Se,
+    DocumentVoided: L
+  },
+  props: {
+    document: {
+      type: Object,
+      required: !0
+    },
+    closeFunc: {
+      type: Function,
+      default: null
+    },
+    showLanguageSelect: {
+      type: Boolean,
+      default: !0
+    }
+  }
+};
+function Re(t, c, e, p, r, m) {
+  const h = f("DocumentVoided"), d = f("DocumentDetails");
+  return e.document && e.document.status === "voided" ? (n(), w(h, {
+    key: 0,
+    document: e.document
+  }, null, 8, ["document"])) : (n(), w(d, {
+    key: 1,
+    document: e.document,
+    "show-language-select": e.showLanguageSelect,
+    close: e.closeFunc
+  }, null, 8, ["document", "show-language-select", "close"]));
+}
+const Te = /* @__PURE__ */ $(Ve, [["render", Re]]);
+export {
+  Te as default
+};