@kiva/kv-components 5.3.6 → 5.3.7

package/dist/vue/KvCartModal.css

@@ -1 +1 @@
-.screen[data-v-50691313]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1400;background-color:#0003}.modal[data-v-50691313]{width:100%;border-bottom-right-radius:.875rem;border-bottom-left-radius:.875rem;--tw-bg-opacity: 1;background-color:rgba(var(--bg-primary),var(--tw-bg-opacity, 1))}@media (min-width: 45.875rem){.modal[data-v-50691313]{position:absolute;right:0}}.modal[data-v-50691313]{max-height:90%}.modal__body[data-v-50691313]{display:flex;gap:1rem;padding-left:1.25rem;padding-right:1.25rem}@media (min-width: 45.875rem){.modal__body[data-v-50691313]{padding-left:2rem;padding-right:2rem}}.modal__body[data-v-50691313]{height:3.75rem}.loan-image[data-v-50691313]{width:3.75rem}.container[data-v-50691313]{position:absolute;top:0;right:0;bottom:0;left:0}@media (min-width: 45.875rem){.modal[data-v-50691313]{max-width:24.5rem}}
+.screen[data-v-faf9d7e4]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1400;background-color:#0003}.modal[data-v-faf9d7e4]{width:100%;border-bottom-right-radius:.875rem;border-bottom-left-radius:.875rem;--tw-bg-opacity: 1;background-color:rgba(var(--bg-primary),var(--tw-bg-opacity, 1))}@media (min-width: 45.875rem){.modal[data-v-faf9d7e4]{position:absolute;right:0}}.modal[data-v-faf9d7e4]{max-height:90%}.modal__body[data-v-faf9d7e4]{display:flex;gap:1rem;padding-left:1.25rem;padding-right:1.25rem}@media (min-width: 45.875rem){.modal__body[data-v-faf9d7e4]{padding-left:2rem;padding-right:2rem}}.container[data-v-faf9d7e4]{position:absolute;top:0;right:0;bottom:0;left:0}@media (min-width: 45.875rem){.modal[data-v-faf9d7e4]{max-width:24.5rem}}

package/dist/vue/KvCartModal.js

@@ -1,19 +1,17 @@
-import { toRefs as P, ref as b, computed as d, watch as j, onMounted as K, onBeforeUnmount as R, resolveComponent as C, openBlock as x, createBlock as V, Transition as L, withCtx as g, withDirectives as F, createElementVNode as o, withModifiers as y, renderSlot as O, createVNode as w, createElementBlock as A, createCommentVNode as D, toDisplayString as f, createTextVNode as I, vShow as H, nextTick as U } from "vue";
-import { mdiClose as q, mdiCheckCircle as z } from "@mdi/js";
-import { useFocusTrap as G } from "@vueuse/integrations/useFocusTrap";
-import { hideOthers as J } from "../vendor/aria-hidden/dist/es2015/index.js";
-import { unlockScroll as Q, lockScroll as W } from "../utils/scrollLock.js";
-import { unlockPrintSingleEl as X, lockPrintSingleEl as Y } from "../utils/printing.js";
-import Z from "./KvButton.js";
-import $ from "./KvMaterialIcon.js";
-import tt from "./KvBorrowerImage.js";
+import { toRefs as B, ref as f, computed as S, watch as M, onMounted as E, onBeforeUnmount as T, resolveComponent as C, openBlock as y, createBlock as N, Transition as V, withCtx as b, withDirectives as K, createElementVNode as e, withModifiers as p, renderSlot as x, createVNode as k, createElementBlock as F, createCommentVNode as I, createTextVNode as P, toDisplayString as R, vShow as j, nextTick as A } from "vue";
+import { mdiClose as D, mdiCheckCircle as L } from "@mdi/js";
+import { useFocusTrap as O } from "@vueuse/integrations/useFocusTrap";
+import { hideOthers as U } from "../vendor/aria-hidden/dist/es2015/index.js";
+import { unlockScroll as q, lockScroll as z } from "../utils/scrollLock.js";
+import { unlockPrintSingleEl as G, lockPrintSingleEl as H } from "../utils/printing.js";
+import J from "./KvButton.js";
+import Q from "./KvMaterialIcon.js";
 import "./KvCartModal.css";
-import et from "../_virtual/_plugin-vue_export-helper.js";
-const ot = {
+import W from "../_virtual/_plugin-vue_export-helper.js";
+const X = {
   components: {
-    KvMaterialIcon: $,
-    KvButton: Z,
-    KvBorrowerImage: tt
+    KvMaterialIcon: Q,
+    KvButton: J
   },
   props: {
     /**
@@ -37,101 +35,69 @@ const ot = {
     basketCount: {
       type: Number,
       default: 0
-    },
-    /**
-     * The loan added to the basket
-     * */
-    addedLoan: {
-      type: Object,
-      default: () => ({})
-    },
-    /**
-     * The photo path for the borrower image
-     * */
-    photoPath: {
-      type: String,
-      default: ""
     }
   },
   emits: [
     "cart-modal-closed"
   ],
-  setup(p, { emit: t }) {
+  setup(c, { emit: t }) {
     const {
-      visible: a,
-      preventClose: e,
-      addedLoan: i
-    } = P(p), c = b(null), n = b(null), k = b(null), m = d(() => [
-      c.value
+      visible: l,
+      preventClose: o
+    } = B(c), s = f(null), n = f(null), d = f(null), m = S(() => [
+      s.value
       // This cart modal
     ]), {
       activate: r,
-      deactivate: B
-    } = G(m, {
+      deactivate: h
+    } = O(m, {
       allowOutsideClick: !0
       // allow clicking outside the cart modal to close it
     });
     let u = null, v = null;
-    const s = (l = "") => {
-      c.value && n.value && (B(), n.value.scrollTop = 0, X(n.value)), Q(), u && (u(), u = null), document.removeEventListener("keyup", v), t("cart-modal-closed", { type: l });
+    const a = (i = "") => {
+      s.value && n.value && (h(), n.value.scrollTop = 0, G(n.value)), q(), u && (u(), u = null), document.removeEventListener("keyup", v), t("cart-modal-closed", { type: i });
     };
-    v = (l) => {
-      l && l.key === "Escape" && !e.value && s();
+    v = (i) => {
+      i && i.key === "Escape" && !o.value && a();
     };
-    const S = () => {
-      e.value || s("background");
-    }, h = () => {
-      a.value && (document.addEventListener("keyup", v), U(() => {
-        c.value && n.value && (r(), u = J(c.value), Y(n.value)), W();
+    const _ = () => {
+      o.value || a("background");
+    }, w = () => {
+      l.value && (document.addEventListener("keyup", v), A(() => {
+        s.value && n.value && (r(), u = U(s.value), H(n.value)), z();
       }));
-    }, _ = d(() => {
-      var l;
-      return ((l = i.value) == null ? void 0 : l.name) ?? "";
-    }), M = d(() => ({
-      alt: `Photo of ${_.value}`,
-      aspectRatio: 1,
-      defaultImage: { width: 300 },
-      hash: i.value.imageHash,
-      images: [
-        {
-          width: 300
-        }
-      ]
-    })), E = d(() => i.value.country ?? ""), T = d(() => i.value.amount ?? ""), N = (l) => {
-      s(l);
+    }, g = (i) => {
+      a(i);
     };
-    return j(a, () => {
-      a.value ? h() : s();
-    }), K(() => {
-      a.value && (h(), setTimeout(() => {
+    return M(l, () => {
+      l.value ? w() : a();
+    }), E(() => {
+      l.value && (w(), setTimeout(() => {
         t("cart-modal-closed", { type: "time" });
       }, 1e4));
-    }), R(() => s()), {
-      mdiClose: q,
-      mdiCheckCircle: z,
+    }), T(() => a()), {
+      mdiClose: D,
+      mdiCheckCircle: L,
       onKeyUp: v,
-      onScreenClick: S,
-      hide: s,
-      show: h,
-      controlsRef: k,
-      handleClick: N,
-      borrowerName: _,
-      borrowerImage: M,
-      borrowerCountry: E,
-      amount: T
+      onScreenClick: _,
+      hide: a,
+      show: w,
+      controlsRef: d,
+      handleClick: g
     };
   }
-}, at = { class: "container" }, lt = { class: "tw-flex tw-p-2.5 md:tw-px-4 md:tw-pt-4 md:tw-pb-3.5" }, nt = { class: "tw-flex tw-flex-grow tw-gap-1 tw-items-center" }, rt = {
+}, Y = { class: "container" }, Z = { class: "tw-flex tw-pt-2 tw-px-2.5" }, $ = { class: "tw-flex tw-flex-grow tw-gap-1 tw-items-center tw-pb-2" }, tt = {
   id: "kvCartModalBody",
   ref: "kvCartModalBody",
   class: "modal__body"
-}, st = { class: "tw-flex tw-items-center tw-justify-between tw-w-full tw-gap-1" }, it = { class: "tw-flex tw-flex-col tw-h-full tw-justify-between" }, ct = { class: "tw-overflow-hidden tw-text-ellipsis tw-line-clamp-1" }, dt = { class: "tw-p-1 tw-text-center tw-rounded tw-bg-secondary tw-text-h5 tw-w-max" }, wt = {
+}, et = {
   ref: "controlsRef",
-  class: "tw-flex-shrink-0 tw-flex tw-justify-end tw-gap-x-2.5 tw-p-2.5 md:tw-px-4 md:tw-pb-4 tw-flex-col tw-gap-1"
+  class: "tw-flex-shrink-0 tw-flex tw-justify-end tw-gap-x-2.5 tw-px-2.5 tw-pb-2 tw-flex-col tw-gap-1"
 };
-function mt(p, t, a, e, i, c) {
-  const n = C("kv-material-icon"), k = C("kv-borrower-image"), m = C("kv-button");
-  return x(), V(L, {
+function ot(c, t, l, o, s, n) {
+  const d = C("kv-material-icon"), m = C("kv-button");
+  return y(), N(V, {
     "enter-active-class": "tw-transition-opacity tw-duration-300",
     "leave-active-class": "tw-transition-opacity tw-duration-300",
     "enter-class": "tw-opacity-0",
@@ -139,97 +105,70 @@ function mt(p, t, a, e, i, c) {
     "leave-class": "tw-opacity-full",
     "leave-to-class": "tw-opacity-0"
   }, {
-    default: g(() => [
-      F(o("div", {
+    default: b(() => [
+      K(e("div", {
         class: "screen",
-        onClick: t[4] || (t[4] = y((...r) => e.onScreenClick && e.onScreenClick(...r), ["stop", "prevent"]))
+        onClick: t[3] || (t[3] = p((...r) => o.onScreenClick && o.onScreenClick(...r), ["stop", "prevent"]))
       }, [
-        o("div", null, [
-          o("div", at, [
-            o("div", {
+        e("div", null, [
+          e("div", Y, [
+            e("div", {
               ref: "kvCartModal",
               tabindex: "-1",
               "data-test": "kv-cart-modal",
               class: "modal",
               "aria-modal": "true",
               "aria-label": "Added to basket",
-              onClick: t[3] || (t[3] = y(() => {
+              onClick: t[2] || (t[2] = p(() => {
               }, ["stop"]))
             }, [
-              o("div", lt, [
-                o("div", nt, [
-                  O(p.$slots, "header", {}, () => [
-                    w(n, {
-                      class: "tw-w-4 tw-h-4 tw-text-brand",
-                      icon: e.mdiCheckCircle
+              e("div", Z, [
+                e("div", $, [
+                  x(c.$slots, "header", {}, () => [
+                    k(d, {
+                      class: "tw-w-3.5 tw-h-3.5 tw-text-brand",
+                      icon: o.mdiCheckCircle
                     }, null, 8, ["icon"]),
-                    t[5] || (t[5] = o("p", { class: "tw-flex-1 tw-font-medium" }, " Added to basket ", -1))
+                    t[4] || (t[4] = e("p", { class: "tw-flex-1 tw-font-medium tw-text-center" }, " Added to basket ", -1))
                   ], !0),
-                  a.preventClose ? D("", !0) : (x(), A("button", {
+                  l.preventClose ? I("", !0) : (y(), F("button", {
                     key: 0,
                     class: "tw-grid tw-content-center tw-justify-center tw-ml-auto tw-w-6 tw-h-6 tw--m-2 hover:tw-text-action-highlight",
-                    onClick: t[0] || (t[0] = y((r) => e.hide("x-button"), ["stop"]))
+                    onClick: t[0] || (t[0] = p((r) => o.hide("x-button"), ["stop"]))
                   }, [
-                    w(n, {
-                      class: "tw-w-3 tw-h-3",
-                      icon: e.mdiClose
+                    k(d, {
+                      class: "tw-w-3.5 tw-h-3.5",
+                      icon: o.mdiClose
                     }, null, 8, ["icon"]),
-                    t[6] || (t[6] = o("span", { class: "tw-sr-only" }, "Close", -1))
+                    t[5] || (t[5] = e("span", { class: "tw-sr-only" }, "Close", -1))
                   ]))
                 ])
               ]),
-              o("div", rt, [
-                o("div", null, [
-                  w(k, {
-                    class: "tw-rounded loan-image",
-                    alt: e.borrowerImage.alt,
-                    "aspect-ratio": e.borrowerImage.aspectRatio,
-                    "default-image": e.borrowerImage.defaultImage,
-                    hash: e.borrowerImage.hash,
-                    images: e.borrowerImage.images,
-                    "photo-path": a.photoPath
-                  }, null, 8, ["alt", "aspect-ratio", "default-image", "hash", "images", "photo-path"])
-                ]),
-                o("div", st, [
-                  o("div", it, [
-                    o("p", ct, f(e.borrowerName), 1),
-                    o("p", dt, f(e.borrowerCountry), 1)
-                  ]),
-                  o("p", null, " $" + f(e.amount), 1)
-                ])
+              e("div", tt, [
+                x(c.$slots, "content", {}, void 0, !0)
               ], 512),
-              o("div", wt, [
-                w(m, {
+              e("div", et, [
+                k(m, {
                   class: "tw-w-full",
-                  onClick: t[1] || (t[1] = (r) => e.handleClick("view-basket"))
+                  onClick: t[1] || (t[1] = (r) => o.handleClick("view-basket"))
                 }, {
-                  default: g(() => [
-                    I(" View basket (" + f(a.basketCount) + ") ", 1)
+                  default: b(() => [
+                    P(" View basket (" + R(l.basketCount) + ") ", 1)
                   ]),
                   _: 1
-                }),
-                w(m, {
-                  class: "tw-w-full",
-                  variant: "secondary",
-                  onClick: t[2] || (t[2] = (r) => e.handleClick("help-another-person"))
-                }, {
-                  default: g(() => t[7] || (t[7] = [
-                    I(" Help another person ")
-                  ])),
-                  _: 1
                 })
               ], 512)
             ], 512)
           ])
         ])
       ], 512), [
-        [H, a.visible]
+        [j, l.visible]
       ])
     ]),
     _: 3
   });
 }
-const xt = /* @__PURE__ */ et(ot, [["render", mt], ["__scopeId", "data-v-50691313"]]);
+const mt = /* @__PURE__ */ W(X, [["render", ot], ["__scopeId", "data-v-faf9d7e4"]]);
 export {
-  xt as default
+  mt as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "5.3.6",
+  "version": "5.3.7",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -106,5 +106,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "652c8676b14247fe6c5fc084ef705781e3f73b6f"
+  "gitHead": "f8e99cbfcfe195d35e6797f608a4b217fb794509"
 }