@kiva/kv-components 4.8.5 → 5.0.0

package/dist/vue/KvClassicLoanCard.js

@@ -0,0 +1,464 @@
+import K from "numeral";
+import { loanCardComputedProperties as V, loanCardMethods as z } from "../utils/loanCard.js";
+import W from "./KvLoanUse.js";
+import I from "./KvBorrowerImage.js";
+import R from "./KvLoanProgressGroup.js";
+import H from "./KvLoanCallouts.js";
+import j from "./KvLendCta.js";
+import U from "./KvLoanBookmark.js";
+import q from "./KvLoanTag.js";
+import E from "./KvMaterialIcon.js";
+import O from "./KvLoadingPlaceholder.js";
+import G from "./KvLoanTeamPick.js";
+import J from "./KvLoanActivities.js";
+import { resolveComponent as r, openBlock as o, createElementBlock as u, normalizeClass as s, normalizeStyle as Q, createElementVNode as c, createBlock as i, resolveDynamicComponent as k, withCtx as g, createVNode as w, createTextVNode as X, toDisplayString as M, createCommentVNode as f, Fragment as Y, renderList as Z } from "vue";
+/* empty css                   */
+import p from "../_virtual/_plugin-vue_export-helper.js";
+const $ = {
+  name: "KvClassicLoanCard",
+  components: {
+    KvBorrowerImage: I,
+    KvLoadingPlaceholder: O,
+    KvLoanUse: W,
+    KvLoanProgressGroup: R,
+    KvMaterialIcon: E,
+    KvLendCta: j,
+    KvLoanTag: q,
+    KvLoanCallouts: H,
+    KvLoanBookmark: U,
+    KvLoanTeamPick: G,
+    KvLoanActivities: J
+  },
+  props: {
+    loanId: {
+      type: Number,
+      default: void 0
+    },
+    loan: {
+      type: Object,
+      default: null
+    },
+    customLoanDetails: {
+      type: Boolean,
+      default: !1
+    },
+    showTags: {
+      type: Boolean,
+      default: !1
+    },
+    categoryPageName: {
+      type: String,
+      default: ""
+    },
+    enableFiveDollarsNotes: {
+      type: Boolean,
+      default: !1
+    },
+    isAdding: {
+      type: Boolean,
+      default: !1
+    },
+    isVisitor: {
+      type: Boolean,
+      default: !0
+    },
+    basketItems: {
+      type: Array,
+      default: () => []
+    },
+    isBookmarked: {
+      type: Boolean,
+      default: !1
+    },
+    kvTrackFunction: {
+      type: Function,
+      required: !0
+    },
+    photoPath: {
+      type: String,
+      required: !0
+    },
+    showViewLoan: {
+      type: Boolean,
+      default: !1
+    },
+    externalLinks: {
+      type: Boolean,
+      default: !1
+    },
+    route: {
+      type: Object,
+      default: void 0
+    },
+    userBalance: {
+      type: String,
+      default: void 0
+    },
+    getCookie: {
+      type: Function,
+      default: void 0
+    },
+    setCookie: {
+      type: Function,
+      default: void 0
+    },
+    fiveDollarsSelected: {
+      type: Boolean,
+      default: !1
+    },
+    customCallouts: {
+      type: Array,
+      default: () => []
+    },
+    useFullWidth: {
+      type: Boolean,
+      default: !1
+    },
+    largeCard: {
+      type: Boolean,
+      default: !1
+    },
+    isTeamPick: {
+      type: Boolean,
+      default: !1
+    },
+    combinedActivities: {
+      type: Array,
+      default: () => []
+    },
+    errorMsg: {
+      type: String,
+      default: ""
+    },
+    enableHugeAmount: {
+      type: Boolean,
+      default: !1
+    },
+    primaryButtonText: {
+      type: String,
+      default: "Lend"
+    },
+    secondaryButtonHandler: {
+      type: Function,
+      default: void 0
+    },
+    secondaryButtonText: {
+      type: String,
+      default: "Checkout now"
+    },
+    showContributors: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(l, { emit: a }) {
+    const {
+      allDataLoaded: e,
+      borrowerName: t,
+      city: S,
+      countryName: d,
+      distributionModel: m,
+      formattedLocation: v,
+      fundraisingPercent: h,
+      hasProgressData: b,
+      imageHash: y,
+      isLoading: _,
+      loanAmount: C,
+      loanBorrowerCount: x,
+      loanCallouts: L,
+      loanStatus: B,
+      loanUse: A,
+      mdiMapMarker: n,
+      readMorePath: P,
+      state: D,
+      tag: T,
+      unreservedAmount: N
+    } = V(l), {
+      clickReadMore: F
+    } = z(l, a);
+    return {
+      allDataLoaded: e,
+      borrowerName: t,
+      city: S,
+      countryName: d,
+      distributionModel: m,
+      formattedLocation: v,
+      fundraisingPercent: h,
+      hasProgressData: b,
+      imageHash: y,
+      isLoading: _,
+      loanAmount: C,
+      loanBorrowerCount: x,
+      loanCallouts: L,
+      loanStatus: B,
+      loanUse: A,
+      mdiMapMarker: n,
+      readMorePath: P,
+      state: D,
+      tag: T,
+      unreservedAmount: N,
+      clickReadMore: F
+    };
+  },
+  computed: {
+    cardWidth() {
+      return this.useFullWidth ? "100%" : "374px";
+    },
+    imageAspectRatio() {
+      return this.largeCard ? 5 / 8 : 3 / 4;
+    },
+    imageDefaultWidth() {
+      return this.largeCard ? 480 : 336;
+    },
+    imageSizes() {
+      return this.largeCard ? [{ width: 480 }] : [
+        { width: this.imageDefaultWidth, viewSize: 1024 },
+        { width: this.imageDefaultWidth, viewSize: 768 },
+        { width: 416, viewSize: 480 },
+        { width: 374, viewSize: 414 },
+        { width: 335, viewSize: 375 }
+      ];
+    },
+    lendersNumber() {
+      var l, a;
+      return ((a = (l = this.loan) == null ? void 0 : l.lenders) == null ? void 0 : a.totalCount) ?? 0;
+    },
+    amountLent() {
+      var a, e;
+      const l = ((e = (a = this.loan) == null ? void 0 : a.loanFundraisingInfo) == null ? void 0 : e.fundedAmount) ?? 0;
+      return K(parseFloat(l)).format("$0,0");
+    }
+  }
+}, ee = { class: "tw-grow" }, te = { class: "loan-card-active-hover" }, ae = {
+  key: 1,
+  class: "tw-relative"
+}, oe = { key: 0 }, ne = {
+  class: "tw-absolute tw-bottom-1 tw-left-1 tw-text-primary tw-bg-white tw-rounded tw-p-1 tw-mb-0 tw-mr-2 tw-text-h4 tw-inline-flex tw-items-center",
+  style: { padding: "2px 6px", "text-transform": "capitalize" }
+}, le = { class: "tw-mb-1.5 tw-pt-1" }, ie = { key: 1 }, re = {
+  key: 0,
+  class: "tw-w-full tw-pt-1 tw-pr-1"
+}, se = {
+  key: 0,
+  class: "tw-text-center tw-w-full tw-mt-1 tw-font-medium"
+}, de = {
+  key: 1,
+  class: "tw-pt-1.5"
+};
+function ue(l, a, e, t, S, d) {
+  const m = r("kv-loading-placeholder"), v = r("kv-borrower-image"), h = r("kv-material-icon"), b = r("kv-loan-team-pick"), y = r("kv-loan-bookmark"), _ = r("kv-loan-tag"), C = r("kv-loan-use"), x = r("kv-loan-callouts"), L = r("kv-loan-progress-group"), B = r("kv-lend-cta"), A = r("KvLoanActivities");
+  return o(), u("div", {
+    class: s(["tw-flex tw-flex-col tw-bg-white tw-rounded tw-w-full tw-pb-1", { "tw-p-1": !e.largeCard, "tw-pointer-events-none": t.isLoading }]),
+    "data-testid": "loan-card",
+    style: Q([{ "box-shadow": "0 4px 12px rgba(0, 0, 0, 0.08)" }, { minWidth: "230px", maxWidth: d.cardWidth }])
+  }, [
+    c("div", ee, [
+      c("div", te, [
+        t.isLoading ? (o(), i(m, {
+          key: 0,
+          class: s(["tw-mb-1 tw-w-full", { "tw-rounded-t tw-rounded-b-none": e.largeCard, "tw-rounded": !e.largeCard }]),
+          style: { height: "15rem" }
+        }, null, 8, ["class"])) : (o(), u("div", ae, [
+          (o(), i(k(t.tag), {
+            to: t.readMorePath,
+            href: t.readMorePath,
+            class: "tw-flex",
+            "aria-label": "Borrower image",
+            onClick: a[0] || (a[0] = (n) => t.clickReadMore("Photo", n))
+          }, {
+            default: g(() => [
+              w(v, {
+                class: s(["tw-relative tw-w-full tw-bg-black", { "tw-rounded-t": e.largeCard, "tw-rounded": !e.largeCard }]),
+                alt: `Photo of ${t.borrowerName}`,
+                "aspect-ratio": d.imageAspectRatio,
+                "default-image": { width: d.imageDefaultWidth },
+                hash: t.imageHash,
+                images: d.imageSizes,
+                "photo-path": e.photoPath
+              }, null, 8, ["class", "alt", "aspect-ratio", "default-image", "hash", "images", "photo-path"]),
+              t.countryName ? (o(), u("div", oe, [
+                c("p", ne, [
+                  w(h, {
+                    class: "tw-h-2 tw-w-2",
+                    icon: t.mdiMapMarker
+                  }, null, 8, ["icon"]),
+                  X(" " + M(t.formattedLocation), 1)
+                ])
+              ])) : f("", !0)
+            ]),
+            _: 1
+          }, 8, ["to", "href"])),
+          e.isTeamPick ? (o(), i(b, {
+            key: 0,
+            class: s(["tw-absolute", { "tw-right-6": !e.isVisitor, "tw-right-0": e.isVisitor }]),
+            style: { top: "-6px" },
+            "data-testid": "loan-card-teampick"
+          }, null, 8, ["class"])) : f("", !0),
+          e.isVisitor ? f("", !0) : (o(), i(y, {
+            key: 1,
+            "loan-id": e.loanId,
+            "is-bookmarked": e.isBookmarked,
+            class: "tw-absolute tw-right-1",
+            style: { top: "-6px" },
+            "data-testid": "loan-card-bookmark",
+            onToggleBookmark: a[1] || (a[1] = (n) => l.$emit("toggle-bookmark"))
+          }, null, 8, ["loan-id", "is-bookmarked"]))
+        ])),
+        (o(), i(k(t.tag), {
+          to: t.readMorePath,
+          href: t.readMorePath,
+          class: s(["tw-flex tw-no-underline hover:tw-no-underline focus:tw-no-underline", { "tw-px-1": e.largeCard }]),
+          "aria-label": "Loan tag",
+          onClick: a[2] || (a[2] = (n) => t.clickReadMore("Tag", n))
+        }, {
+          default: g(() => [
+            e.showTags && !t.isLoading ? (o(), i(_, {
+              key: 0,
+              loan: e.loan
+            }, null, 8, ["loan"])) : f("", !0)
+          ]),
+          _: 1
+        }, 8, ["to", "href", "class"])),
+        (o(), i(k(t.tag), {
+          to: t.readMorePath,
+          href: t.readMorePath,
+          class: "loan-card-use tw-no-underline tw-text-primary",
+          "aria-label": "Loan use",
+          onClick: a[3] || (a[3] = (n) => t.clickReadMore("Use", n))
+        }, {
+          default: g(() => [
+            c("div", le, [
+              t.isLoading ? (o(), u("div", {
+                key: 0,
+                class: s(["tw-w-full", { "tw-px-1": e.largeCard }]),
+                style: { height: "5.5rem" }
+              }, [
+                (o(!0), u(Y, null, Z([...Array(4)], (n, P) => (o(), u("div", {
+                  key: P,
+                  class: "tw-h-2 tw-mb-1"
+                }, [
+                  w(m)
+                ]))), 128))
+              ], 2)) : (o(), u("div", ie, [
+                w(C, {
+                  use: t.loanUse,
+                  "loan-amount": t.loanAmount,
+                  status: t.loanStatus,
+                  "borrower-count": t.loanBorrowerCount,
+                  name: t.borrowerName,
+                  "distribution-model": t.distributionModel,
+                  class: s({ "tw-px-1": e.largeCard })
+                }, null, 8, ["use", "loan-amount", "status", "borrower-count", "name", "distribution-model", "class"])
+              ]))
+            ])
+          ]),
+          _: 1
+        }, 8, ["to", "href"]))
+      ]),
+      t.isLoading || typeof t.loanCallouts > "u" ? (o(), i(m, {
+        key: 0,
+        class: s(["tw-mt-1.5 tw-mb-1", { "tw-mx-1": e.largeCard }]),
+        style: { width: "60%", height: "1.75rem", "border-radius": "500rem" }
+      }, null, 8, ["class"])) : (o(), i(x, {
+        key: 1,
+        callouts: t.loanCallouts,
+        class: s(["tw-mt-1.5", { "tw-px-1": e.largeCard }]),
+        onClick: a[4] || (a[4] = (n) => l.$emit("jump-filter-page", n))
+      }, null, 8, ["callouts", "class"]))
+    ]),
+    c("div", {
+      class: s(["tw-flex tw-justify-between tw-mt-2", { "tw-px-1": e.largeCard }])
+    }, [
+      t.hasProgressData ? f("", !0) : (o(), u("div", re, [
+        w(m, {
+          class: "tw-mb-0.5",
+          style: { width: "70%", height: "1.3rem" }
+        }),
+        w(m, {
+          class: "tw-rounded",
+          style: { width: "70%", height: "0.5rem" }
+        })
+      ])),
+      c("div", null, [
+        t.unreservedAmount > 0 ? (o(), i(k(t.tag), {
+          key: 0,
+          to: t.readMorePath,
+          href: t.readMorePath,
+          class: "loan-card-progress tw-no-underline tw-mt-1",
+          "aria-label": "Loan progress",
+          onClick: a[5] || (a[5] = (n) => t.clickReadMore("Progress", n))
+        }, {
+          default: g(() => [
+            w(L, {
+              id: "loanProgress",
+              "money-left": `${t.unreservedAmount}`,
+              "progress-percent": t.fundraisingPercent,
+              class: "tw-text-black"
+            }, null, 8, ["money-left", "progress-percent"])
+          ]),
+          _: 1
+        }, 8, ["to", "href"])) : f("", !0)
+      ]),
+      t.allDataLoaded ? (o(), i(B, {
+        key: 2,
+        loan: e.loan,
+        "basket-items": e.basketItems,
+        "is-loading": t.isLoading,
+        "is-adding": e.isAdding,
+        "enable-five-dollars-notes": e.enableFiveDollarsNotes,
+        "five-dollars-selected": e.fiveDollarsSelected,
+        "kv-track-function": e.kvTrackFunction,
+        "show-view-loan": e.showViewLoan,
+        "custom-loan-details": e.customLoanDetails,
+        "external-links": e.externalLinks,
+        route: e.route,
+        "user-balance": e.userBalance,
+        "get-cookie": e.getCookie,
+        "set-cookie": e.setCookie,
+        "enable-huge-amount": e.enableHugeAmount,
+        "is-visitor": e.isVisitor,
+        "primary-button-text": e.primaryButtonText,
+        "secondary-button-text": e.secondaryButtonText,
+        "secondary-button-handler": e.secondaryButtonHandler,
+        class: s(["tw-mt-auto", { "tw-w-full": t.unreservedAmount <= 0 }]),
+        onAddToBasket: a[6] || (a[6] = (n) => l.$emit("add-to-basket", n)),
+        onShowLoanDetails: a[7] || (a[7] = (n) => t.clickReadMore("ViewLoan", n)),
+        onRemoveFromBasket: a[8] || (a[8] = (n) => l.$emit("remove-from-basket", n))
+      }, null, 8, ["loan", "basket-items", "is-loading", "is-adding", "enable-five-dollars-notes", "five-dollars-selected", "kv-track-function", "show-view-loan", "custom-loan-details", "external-links", "route", "user-balance", "get-cookie", "set-cookie", "enable-huge-amount", "is-visitor", "primary-button-text", "secondary-button-text", "secondary-button-handler", "class"])) : (o(), i(m, {
+        key: 1,
+        class: "tw-rounded tw-self-start",
+        style: { width: "9rem", height: "3rem" }
+      }))
+    ], 2),
+    e.showContributors && d.lendersNumber && d.amountLent ? (o(), u("div", se, [
+      c("p", null, M(d.lendersNumber) + " people contributed " + M(d.amountLent), 1)
+    ])) : f("", !0),
+    e.combinedActivities.length > 0 ? (o(), u("div", de, [
+      a[10] || (a[10] = c("hr", { class: "tw-border-tertiary tw-mb-1 tw-w-5/6 tw-mx-auto" }, null, -1)),
+      w(A, {
+        loan: e.loan,
+        "combined-activities": e.combinedActivities,
+        "kv-track-function": e.kvTrackFunction,
+        "basket-items": e.basketItems,
+        "is-adding": e.isAdding,
+        "enable-five-dollars-notes": e.enableFiveDollarsNotes,
+        "five-dollars-selected": e.fiveDollarsSelected,
+        "show-view-loan": e.showViewLoan,
+        "custom-loan-details": e.customLoanDetails,
+        "external-links": e.externalLinks,
+        route: e.route,
+        "user-balance": e.userBalance,
+        "get-cookie": e.getCookie,
+        "set-cookie": e.setCookie,
+        "error-msg": e.errorMsg,
+        "enable-huge-amount": e.enableHugeAmount,
+        "is-visitor": e.isVisitor,
+        onAddToBasket: a[9] || (a[9] = (n) => l.$emit("add-to-basket", n))
+      }, null, 8, ["loan", "combined-activities", "kv-track-function", "basket-items", "is-adding", "enable-five-dollars-notes", "five-dollars-selected", "show-view-loan", "custom-loan-details", "external-links", "route", "user-balance", "get-cookie", "set-cookie", "error-msg", "enable-huge-amount", "is-visitor"])
+    ])) : f("", !0)
+  ], 6);
+}
+const Pe = /* @__PURE__ */ p($, [["render", ue], ["__scopeId", "data-v-d014fd7b"]]);
+export {
+  Pe as default
+};

package/dist/vue/KvCommentsAdd.css

@@ -0,0 +1 @@
+[data-v-0f318c7e] input{height:2rem;border-radius:0;border-top-width:0px;border-right-width:0px;border-left-width:0px;padding:0}[data-v-0f318c7e] input:focus{--tw-border-opacity: 1;border-color:rgba(var(--border-tertiary),var(--tw-border-opacity, 1));box-shadow:none}[data-v-0f318c7e] button>span{min-height:0}[data-v-0f318c7e] button>span>span{padding-top:0;padding-bottom:0;padding-left:.25rem;padding-right:.25rem}

package/dist/vue/KvCommentsAdd.js

@@ -0,0 +1,106 @@
+import { ref as u, computed as C, resolveComponent as s, openBlock as x, createElementBlock as g, createElementVNode as n, createVNode as a, toDisplayString as y, withKeys as D, withCtx as p, createTextVNode as _ } from "vue";
+import k from "./KvButton.js";
+import N from "./KvTextInput.js";
+import V from "./KvUserAvatar.js";
+/* empty css               */
+import E from "../_virtual/_plugin-vue_export-helper.js";
+const h = "add-comment-value", f = "add-comment", m = "hide-input", I = {
+  name: "KvCommentsAdd",
+  components: {
+    KvButton: k,
+    KvTextInput: N,
+    KvUserAvatar: V
+  },
+  props: {
+    /**
+     * The full URL for the user image
+     */
+    userImageUrl: {
+      type: String,
+      default: ""
+    },
+    /**
+     * The name to display for the user
+     */
+    userDisplayName: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Whether or not the comment is a reply
+     */
+    isReply: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: [f, m],
+  setup(l, { emit: t }) {
+    const e = u(""), o = u(null), c = C(() => e.value ? "" : "disabled");
+    return {
+      ADD_COMMENT_ID: h,
+      addCommentValue: e,
+      commentButtonState: c,
+      cancel: () => {
+        e.value = "", l.isReply && t(m);
+      },
+      comment: () => {
+        t(f, e.value), e.value = "", l.isReply && t(m);
+      },
+      focus: () => o.value.focus()
+    };
+  }
+}, K = { class: "tw-flex tw-flex-col" }, T = { class: "tw-flex tw-flex-col md:tw-flex-row md:tw-items-center tw-gap-0.5 md:tw-gap-1" }, A = { class: "tw-flex tw-items-center tw-gap-1" }, B = { class: "data-hj-suppress tw-font-medium" }, M = { class: "tw-flex tw-py-0.5 tw-gap-0.5" };
+function S(l, t, e, o, c, v) {
+  const d = s("kv-user-avatar"), r = s("kv-text-input"), i = s("kv-button");
+  return x(), g("div", K, [
+    n("div", T, [
+      n("div", A, [
+        a(d, {
+          "lender-name": e.userDisplayName,
+          "lender-image-url": e.userImageUrl,
+          "is-small": ""
+        }, null, 8, ["lender-name", "lender-image-url"]),
+        n("div", B, y(e.userDisplayName), 1)
+      ]),
+      a(r, {
+        id: o.ADD_COMMENT_ID,
+        ref: "input",
+        modelValue: o.addCommentValue,
+        "onUpdate:modelValue": t[0] || (t[0] = (w) => o.addCommentValue = w),
+        placeholder: "Add a comment...",
+        class: "data-hj-suppress tw-grow",
+        onKeyup: D(o.comment, ["enter"])
+      }, null, 8, ["id", "modelValue", "onKeyup"])
+    ]),
+    n("div", M, [
+      a(i, {
+        variant: "ghost",
+        class: "tw-ml-auto",
+        onClick: o.cancel
+      }, {
+        default: p(() => t[1] || (t[1] = [
+          _(" Cancel ")
+        ])),
+        _: 1
+      }, 8, ["onClick"]),
+      a(i, {
+        variant: "ghost",
+        state: o.commentButtonState,
+        onClick: o.comment
+      }, {
+        default: p(() => t[2] || (t[2] = [
+          _(" Comment ")
+        ])),
+        _: 1
+      }, 8, ["state", "onClick"])
+    ])
+  ]);
+}
+const P = /* @__PURE__ */ E(I, [["render", S], ["__scopeId", "data-v-0f318c7e"]]);
+export {
+  f as ADD_COMMENT_EVENT,
+  h as ADD_COMMENT_ID,
+  m as HIDE_INPUT_EVENT,
+  P as default
+};

package/dist/vue/KvCommentsContainer.js

@@ -0,0 +1,80 @@
+import d from "./KvCommentsAdd.js";
+import _ from "./KvCommentsList.js";
+import { resolveComponent as s, openBlock as m, createElementBlock as f, createBlock as a, createCommentVNode as r } from "vue";
+import p from "../_virtual/_plugin-vue_export-helper.js";
+const y = "add-comment", l = "add-reaction", C = {
+  name: "KvCommentsContainer",
+  components: {
+    KvCommentsAdd: d,
+    KvCommentsList: _
+  },
+  props: {
+    /**
+     * The full URL for the user image
+     */
+    userImageUrl: {
+      type: String,
+      default: ""
+    },
+    /**
+     * The name to display for the user
+     */
+    userDisplayName: {
+      type: String,
+      default: ""
+    },
+    /**
+     * The ID for the user
+     */
+    userPublicId: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Activity comments
+     */
+    comments: {
+      type: Array,
+      default: () => []
+    }
+  },
+  emits: [l],
+  setup(i, { emit: o }) {
+    return {
+      handleReaction: (n) => {
+        let t;
+        n.value === void 0 ? t = {
+          reaction: y,
+          id: null,
+          isChild: !1,
+          value: n
+        } : t = n, o(l, t);
+      }
+    };
+  }
+};
+function v(i, o, e, n, t, g) {
+  const u = s("kv-comments-add"), c = s("kv-comments-list");
+  return m(), f("div", null, [
+    e.userPublicId ? (m(), a(u, {
+      key: 0,
+      "user-image-url": e.userImageUrl,
+      "user-display-name": e.userDisplayName,
+      onAddComment: n.handleReaction
+    }, null, 8, ["user-image-url", "user-display-name", "onAddComment"])) : r("", !0),
+    e.comments ? (m(), a(c, {
+      key: 1,
+      "user-image-url": e.userImageUrl,
+      "user-display-name": e.userDisplayName,
+      "user-public-id": e.userPublicId,
+      comments: e.comments,
+      onAddReaction: n.handleReaction
+    }, null, 8, ["user-image-url", "user-display-name", "user-public-id", "comments", "onAddReaction"])) : r("", !0)
+  ]);
+}
+const E = /* @__PURE__ */ p(C, [["render", v]]);
+export {
+  y as ADD_COMMENT_EVENT,
+  l as ADD_REACTION_EVENT,
+  E as default
+};

package/dist/vue/KvCommentsHeartButton.css

@@ -0,0 +1 @@
+.filled[data-v-50e5ceb0] svg{fill:#f60059}