@kiva/kv-components 6.29.2 → 6.30.0

package/dist/vue/KvLendCta.css

@@ -1 +1 @@
-.amountDropdownWrapper[data-v-cc6815c8] select{border-radius:14px 0 0 14px}.lend-again[data-v-cc6815c8] span{padding-left:0;padding-right:0;padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-cc6815c8] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-cc6815c8] select{cursor:pointer;border-radius:.875rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-cc6815c8] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.preset-option[data-v-cc6815c8] span.tw-w-full:first-child{border-width:2px;--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-dropdown[data-v-cc6815c8] select,.selected-option[data-v-cc6815c8] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgba(var(--border-action),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgba(var(--bg-secondary),var(--tw-bg-opacity, 1))}.button-ellipsis[data-v-cc6815c8] span>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.amountDropdownWrapper[data-v-898962c3] select{border-radius:14px 0 0 14px}.lend-again[data-v-898962c3] span{padding-left:0;padding-right:0;padding-left:.5rem;padding-right:.5rem}.lendButtonWrapper[data-v-898962c3] span:first-child{border-radius:0 14px 14px 0}.filtered-dropdown[data-v-898962c3] select{cursor:pointer;border-radius:.875rem;border-width:2px;font-weight:500}.unselected-dropdown[data-v-898962c3] select{--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.preset-option[data-v-898962c3] span.tw-w-full:first-child{border-width:2px;--tw-border-opacity: 1;border-color:rgb(158 158 158 / var(--tw-border-opacity, 1))}.selected-dropdown[data-v-898962c3] select,.selected-option[data-v-898962c3] span.tw-w-full:first-child{--tw-border-opacity: 1;border-color:rgba(var(--border-action),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgba(var(--bg-secondary),var(--tw-bg-opacity, 1))}.button-ellipsis[data-v-898962c3] span>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

package/dist/vue/KvLendCta.js

@@ -1,36 +1,34 @@
-import C from "graphql-tag";
-import { mdiChevronRight as b } from "@mdi/js";
-import { getLendCtaSelectedOption as g, getDropdownPriceArray as D } from "../utils/loanUtils.js";
-import P from "./KvLendAmountButton.js";
-import S from "./KvSelect.js";
+import T from "graphql-tag";
+import { mdiChevronRight as _ } from "@mdi/js";
+import { getLendCtaSelectedOption as g, getDropdownPriceArray as C } from "../utils/loanUtils.js";
+import D from "./KvLendAmountButton.js";
+import P from "./KvSelect.js";
 import F from "./KvButton.js";
-import I from "./KvMaterialIcon.js";
-import N from "./KvCartPill.js";
-import { resolveComponent as A, openBlock as i, createElementBlock as r, createBlock as a, withCtx as l, createElementVNode as u, createCommentVNode as d, normalizeClass as m, createTextVNode as w, toDisplayString as f, createVNode as V, withModifiers as y, Fragment as L, renderList as v } from "vue";
+import S from "./KvMaterialIcon.js";
+import { resolveComponent as k, openBlock as i, createElementBlock as a, createBlock as r, normalizeClass as c, withCtx as d, createTextVNode as m, toDisplayString as f, createElementVNode as p, createVNode as I, withModifiers as y, Fragment as B, renderList as v, createCommentVNode as l } from "vue";
 import "./KvLendCta.css";
-import O from "../_virtual/_plugin-vue_export-helper.js";
-const k = "Other", it = C`
+import N from "../_virtual/_plugin-vue_export-helper.js";
+const w = "Other", nt = T`
 	fragment KvLendCta on LoanBasic {
 		id
 		name
 		status
 		minNoteSize
 	}
-`, at = C`
+`, st = T`
 	fragment KvLendCtaUser on LoanBasic {
 		id
 		userProperties {
 			lentTo
 		}
 	}
-`, M = {
+`, O = {
   name: "KvLendCta",
   components: {
-    KvLendAmountButton: P,
+    KvLendAmountButton: D,
     KvUiButton: F,
-    KvUiSelect: S,
-    KvMaterialIcon: I,
-    KvCartPill: N
+    KvUiSelect: P,
+    KvMaterialIcon: S
   },
   props: {
     loan: {
@@ -124,16 +122,12 @@ const k = "Other", it = C`
     kvTrackCategory: {
       type: String,
       default: "Lending"
-    },
-    showPill: {
-      type: Boolean,
-      default: !1
     }
   },
   data() {
     var t, n;
     return {
-      mdiChevronRight: b,
+      mdiChevronRight: _,
       defaultAmountOptions: [25, 50, 75],
       selectedOption: g(
         this.getCookie,
@@ -144,8 +138,8 @@ const k = "Other", it = C`
         this.userBalance,
         this.fiveDollarsSelected
       ),
-      selectedDropdownOption: k,
-      OTHER_OPTION: k
+      selectedDropdownOption: w,
+      OTHER_OPTION: w
     };
   },
   computed: {
@@ -173,7 +167,7 @@ const k = "Other", it = C`
       return ((t = this.basketItems) == null ? void 0 : t.some((n) => n.__typename === "LoanReservation" && n.id === this.loanId)) ?? !1;
     },
     prices() {
-      const t = parseFloat(this.unreservedAmount < 25 ? this.minNoteSize : 25), n = D(
+      const t = parseFloat(this.unreservedAmount < 25 ? this.minNoteSize : 25), n = C(
         this.unreservedAmount,
         this.isCompleteLoanActive,
         t,
@@ -190,7 +184,7 @@ const k = "Other", it = C`
       if (this.prices.length === 4)
         return [];
       const t = this.prices.slice(this.defaultAmountOptions.length);
-      return t.unshift(k), t;
+      return t.unshift(w), t;
     },
     loanName() {
       var t;
@@ -260,7 +254,7 @@ const k = "Other", it = C`
       return this.isLentTo && !this.isLessThan25;
     },
     selectedDropdown() {
-      return this.selectedDropdownOption !== k;
+      return this.selectedDropdownOption !== w;
     },
     showFilteredDropdown() {
       return this.presetDropdownPrices.length > 1;
@@ -271,17 +265,17 @@ const k = "Other", it = C`
   },
   watch: {
     unreservedAmount(t, n) {
-      var s, p;
+      var s, A;
       t !== n && n === "" && (this.selectedOption = g(
         this.getCookie,
         this.setCookie,
         this.enableFiveDollarsNotes,
-        (p = (s = this.route) == null ? void 0 : s.query) == null ? void 0 : p.utm_campaign,
+        (A = (s = this.route) == null ? void 0 : s.query) == null ? void 0 : A.utm_campaign,
         t,
         this.userBalance,
         this.fiveDollarsSelected,
         this.showPresetAmounts
-      )), this.showPresetAmounts && (this.selectedOption = k);
+      )), this.showPresetAmounts && (this.selectedOption = w);
     }
   },
   methods: {
@@ -331,7 +325,7 @@ const k = "Other", it = C`
         t,
         this.loanId,
         this.loanId
-      ), this.selectedOption = t, this.selectedDropdownOption = k;
+      ), this.selectedOption = t, this.selectedDropdownOption = w;
     },
     handleCheckout() {
       this.kvTrackFunction(
@@ -343,155 +337,115 @@ const k = "Other", it = C`
       );
     }
   }
-}, K = { class: "tw-whitespace-nowrap" }, R = {
-  key: 3,
+}, V = { class: "tw-whitespace-nowrap" }, K = {
+  key: 2,
   class: "tw-w-full tw-text-center tw-rounded tw-p-2",
   style: { background: "#f1f1f1" }
-}, U = { class: "tw-flex" }, E = ["disabled"], H = {
+}, M = { class: "tw-flex" }, R = ["disabled"], E = {
   key: 0,
   class: "tw-flex tw-gap-1 lg:tw-gap-2 tw-flex-wrap md:tw-flex-nowrap"
-}, j = ["value"], z = {
+}, U = ["value"], z = {
   key: 1,
   class: "amountDropdownWrapper"
-}, q = ["value"];
-function Z(t, n, s, p, h, e) {
-  const x = A("kv-cart-pill"), c = A("kv-ui-button"), T = A("kv-material-icon"), B = A("kv-ui-select"), _ = A("kv-lend-amount-button");
-  return i(), r("div", K, [
-    s.showPill && s.showPresetAmounts ? (i(), a(x, {
+}, H = ["value"];
+function j(t, n, s, A, u, e) {
+  const h = k("kv-ui-button"), x = k("kv-material-icon"), L = k("kv-ui-select"), b = k("kv-lend-amount-button");
+  return i(), a("div", V, [
+    e.isInBasket ? (i(), r(h, {
       key: 0,
-      "borrower-name": e.loanName,
-      class: "!tw-w-full tw-justify-center tw-pb-2"
-    }, {
-      icon: l(() => n[5] || (n[5] = [
-        u("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          width: "25",
-          height: "24",
-          viewBox: "0 0 25 24",
-          fill: "none",
-          class: "tw-min-w-3"
-        }, [
-          u("mask", {
-            id: "mask0_5025_974",
-            style: { "mask-type": "alpha" },
-            maskUnits: "userSpaceOnUse",
-            x: "0",
-            y: "0",
-            width: "25",
-            height: "24"
-          }, [
-            u("rect", {
-              x: "0.5",
-              width: "24",
-              height: "24",
-              fill: "#D9D9D9"
-            })
-          ]),
-          u("g", { mask: "url(#mask0_5025_974)" }, [
-            u("path", {
-              d: "M12.5001 21L9.1251 22.125C9.00843 22.1583 8.9001 22.1833 8.8001 22.2C8.7001 22.2167 8.6001 22.225 8.5001 22.225C7.96676 22.225 7.5001 22.0375 7.1001 21.6625C6.7001 21.2875 6.5001 20.8083 6.5001 20.225V14.775L3.9001 10.55C3.8001 10.3833 3.7251 10.2125 3.6751 10.0375C3.6251 9.8625 3.6001 9.68333 3.6001 9.5C3.6001 9.31667 3.6251 9.1375 3.6751 8.9625C3.7251 8.7875 3.8001 8.61667 3.9001 8.45L7.3001 2.95C7.48343 2.65 7.7251 2.41667 8.0251 2.25C8.3251 2.08333 8.6501 2 9.0001 2H16.0001C16.3501 2 16.6751 2.08333 16.9751 2.25C17.2751 2.41667 17.5168 2.65 17.7001 2.95L21.1001 8.45C21.2001 8.61667 21.2751 8.7875 21.3251 8.9625C21.3751 9.1375 21.4001 9.31667 21.4001 9.5C21.4001 9.68333 21.3751 9.8625 21.3251 10.0375C21.2751 10.2125 21.2001 10.3833 21.1001 10.55L18.5001 14.775V20.225C18.5001 20.8083 18.3001 21.2875 17.9001 21.6625C17.5001 22.0375 17.0334 22.225 16.5001 22.225C16.4001 22.225 16.3001 22.2167 16.2001 22.2C16.1001 22.1833 15.9918 22.1583 15.8751 22.125L12.5001 21ZM9.0001 15H16.0001L19.4001 9.5L16.0001 4H9.0001L5.6001 9.5L9.0001 15ZM11.4501 10.75L14.9751 7.2C15.1584 7 15.3876 6.90417 15.6626 6.9125C15.9376 6.92083 16.1751 7.01667 16.3751 7.2C16.5751 7.4 16.6793 7.6375 16.6876 7.9125C16.6959 8.1875 16.6001 8.425 16.4001 8.625L12.1501 12.875C11.9501 13.075 11.7168 13.175 11.4501 13.175C11.1834 13.175 10.9501 13.075 10.7501 12.875L8.6251 10.75C8.4251 10.55 8.3251 10.3125 8.3251 10.0375C8.3251 9.7625 8.4251 9.525 8.6251 9.325C8.8251 9.125 9.0626 9.025 9.3376 9.025C9.6126 9.025 9.8501 9.125 10.0501 9.325L11.4501 10.75Z",
-              fill: "#757575"
-            })
-          ])
-        ], -1)
-      ])),
-      _: 1
-    }, 8, ["borrower-name"])) : d("", !0),
-    e.isInBasket ? (i(), a(c, {
-      key: 1,
       variant: "secondary",
-      class: m(["tw-inline-flex tw-flex-1", { "tw-w-full": s.showPresetAmounts }]),
+      class: c(["tw-inline-flex tw-flex-1", { "tw-w-full": s.showPresetAmounts }]),
       "data-testid": "bp-lend-cta-checkout-button",
       to: s.externalLinks ? void 0 : "/basket",
       href: s.externalLinks ? "/basket" : void 0,
       onClick: n[0] || (n[0] = (o) => e.clickSecondaryButton(o))
     }, {
-      default: l(() => [
-        w(f(e.loanInBasketButtonText), 1)
+      default: d(() => [
+        m(f(e.loanInBasketButtonText), 1)
       ]),
       _: 1
-    }, 8, ["class", "to", "href"])) : e.showNonActionableLoanButton ? (i(), a(c, {
-      key: 2,
+    }, 8, ["class", "to", "href"])) : e.showNonActionableLoanButton ? (i(), r(h, {
+      key: 1,
       class: "tw-inline-flex tw-flex-1"
     }, {
-      default: l(() => [
-        w(f(e.ctaButtonText), 1)
+      default: d(() => [
+        m(f(e.ctaButtonText), 1)
       ]),
       _: 1
-    })) : e.isFunded ? (i(), r("div", R, " This loan was just funded! 🎉 ")) : s.showViewLoan ? (i(), a(c, {
-      key: 4,
+    })) : e.isFunded ? (i(), a("div", K, " This loan was just funded! 🎉 ")) : s.showViewLoan ? (i(), r(h, {
+      key: 3,
       state: `${e.allSharesReserved ? "disabled" : ""}`,
       to: s.externalLinks ? void 0 : e.readMorePath,
       href: s.externalLinks ? e.readMorePath : void 0,
       class: "tw-mb-0",
       onClick: n[1] || (n[1] = (o) => t.$emit("show-loan-details", o))
     }, {
-      default: l(() => [
-        u("span", U, [
-          n[6] || (n[6] = w(" View loan ")),
-          V(T, {
+      default: d(() => [
+        p("span", M, [
+          n[5] || (n[5] = m(" View loan ")),
+          I(x, {
             class: "tw-w-3 tw-h-3 tw-align-middle",
-            icon: h.mdiChevronRight
+            icon: u.mdiChevronRight
           }, null, 8, ["icon"])
         ])
       ]),
       _: 1
-    }, 8, ["state", "to", "href"])) : e.useFormSubmit ? (i(), r("form", {
-      key: 5,
+    }, 8, ["state", "to", "href"])) : e.useFormSubmit ? (i(), a("form", {
+      key: 4,
       class: "tw-w-full tw-flex",
       onSubmit: n[4] || (n[4] = y((...o) => e.addToBasket && e.addToBasket(...o), ["prevent"]))
     }, [
-      u("fieldset", {
-        class: m(["tw-w-full tw-flex", {
+      p("fieldset", {
+        class: c(["tw-w-full tw-flex", {
           "tw-flex-col md:tw-flex-row md:tw-justify-between tw-min-w-0": s.showPresetAmounts,
           "tw-gap-1.5": s.showPresetAmounts && !e.isLendAmountButton
         }]),
         disabled: s.isAdding,
         "data-testid": "bp-lend-cta-select-and-button"
       }, [
-        s.showPresetAmounts && !s.isAdding ? (i(), r("div", H, [
-          e.isLendAmountButton ? d("", !0) : (i(!0), r(L, { key: 0 }, v(e.presetButtonsPrices, (o) => (i(), a(c, {
+        s.showPresetAmounts && !s.isAdding ? (i(), a("div", E, [
+          e.isLendAmountButton ? l("", !0) : (i(!0), a(B, { key: 0 }, v(e.presetButtonsPrices, (o) => (i(), r(h, {
             key: o,
             variant: "secondary",
-            class: m(["tw-inline-flex tw-flex-1 preset-option tw-w-8", { "selected-option": h.selectedOption == o }]),
+            class: c(["tw-inline-flex tw-flex-1 preset-option tw-w-8", { "selected-option": u.selectedOption == o }]),
             "data-testid": "bp-lend-cta-lend-button",
-            onClick: (G) => e.clickPresetButton(o)
+            onClick: (q) => e.clickPresetButton(o)
           }, {
-            default: l(() => [
-              w(" $" + f(o), 1)
+            default: d(() => [
+              m(" $" + f(o), 1)
             ]),
             _: 2
           }, 1032, ["class", "onClick"]))), 128)),
-          e.showFilteredDropdown ? (i(), a(B, {
+          e.showFilteredDropdown ? (i(), r(L, {
             key: 1,
             id: `LoanAmountDropdown_${e.loanId}`,
-            modelValue: h.selectedDropdownOption,
+            modelValue: u.selectedDropdownOption,
             "onUpdate:modelValue": [
-              n[2] || (n[2] = (o) => h.selectedDropdownOption = o),
+              n[2] || (n[2] = (o) => u.selectedDropdownOption = o),
               e.trackLendAmountSelection
             ],
-            class: m(["tw-min-w-12 tw-rounded filtered-dropdown tw-w-full", {
+            class: c(["tw-min-w-12 tw-rounded filtered-dropdown tw-w-full", {
               "unselected-dropdown": !e.selectedDropdown,
               "selected-dropdown": e.selectedDropdown
             }]),
             "aria-label": "Lend amount",
             onClick: y(e.clickDropdown, ["stop"])
           }, {
-            default: l(() => [
-              (i(!0), r(L, null, v(e.presetDropdownPrices, (o) => (i(), r("option", {
+            default: d(() => [
+              (i(!0), a(B, null, v(e.presetDropdownPrices, (o) => (i(), a("option", {
                 key: o,
                 value: o
-              }, f(o !== h.OTHER_OPTION ? `$${o}` : o), 9, j))), 128))
+              }, f(o !== u.OTHER_OPTION ? `$${o}` : o), 9, U))), 128))
             ]),
             _: 1
-          }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : d("", !0)
-        ])) : s.showPresetAmounts ? d("", !0) : (i(), r("div", z, [
-          e.hideShowLendDropdown && !e.isLessThan25 ? (i(), a(B, {
+          }, 8, ["id", "modelValue", "class", "onUpdate:modelValue", "onClick"])) : l("", !0)
+        ])) : s.showPresetAmounts ? l("", !0) : (i(), a("div", z, [
+          e.hideShowLendDropdown && !e.isLessThan25 ? (i(), r(L, {
             key: 0,
             id: `LoanAmountDropdown_${e.loanId}`,
-            modelValue: h.selectedOption,
+            modelValue: u.selectedOption,
             "onUpdate:modelValue": [
-              n[3] || (n[3] = (o) => h.selectedOption = o),
+              n[3] || (n[3] = (o) => u.selectedOption = o),
               e.trackLendAmountSelection
             ],
             class: "tw-min-w-12",
@@ -499,45 +453,45 @@ function Z(t, n, s, p, h, e) {
             "aria-label": "Lend amount",
             onClick: y(e.clickDropdown, ["stop"])
           }, {
-            default: l(() => [
-              (i(!0), r(L, null, v(e.prices, (o) => (i(), r("option", {
+            default: d(() => [
+              (i(!0), a(B, null, v(e.prices, (o) => (i(), a("option", {
                 key: o,
                 value: o
-              }, " $" + f(o), 9, q))), 128))
+              }, " $" + f(o), 9, H))), 128))
             ]),
             _: 1
-          }, 8, ["id", "modelValue", "onUpdate:modelValue", "onClick"])) : d("", !0)
+          }, 8, ["id", "modelValue", "onUpdate:modelValue", "onClick"])) : l("", !0)
         ])),
-        u("div", {
-          class: m({
+        p("div", {
+          class: c({
             "tw-min-w-0": s.showPresetAmounts,
             lendButtonWrapper: e.hideShowLendDropdown && !s.showPresetAmounts,
             "tw-hidden": e.hideLendButton
           })
         }, [
-          e.lendButtonVisibility && !e.isLessThan25 ? (i(), a(c, {
+          e.lendButtonVisibility && !e.isLessThan25 ? (i(), r(h, {
             key: "lendButton",
-            class: m(["tw-inline-flex tw-flex-1", { "button-ellipsis tw-w-full": s.showPresetAmounts }]),
+            class: c(["tw-inline-flex tw-flex-1", { "button-ellipsis tw-w-full": s.showPresetAmounts }]),
             "data-testid": "bp-lend-cta-lend-button",
             type: "submit"
           }, {
-            default: l(() => [
-              w(f(e.ctaButtonText), 1)
+            default: d(() => [
+              m(f(e.ctaButtonText), 1)
             ]),
             _: 1
-          }, 8, ["class"])) : e.showLendAgain ? (i(), a(c, {
+          }, 8, ["class"])) : e.showLendAgain ? (i(), r(h, {
             key: "lendAgainButton",
-            class: m(["lend-again", { "tw-w-full": s.showPresetAmounts }]),
+            class: c(["lend-again", { "tw-w-full": s.showPresetAmounts }]),
             "data-testid": "bp-lend-cta-lend-again-button",
             type: "submit"
           }, {
-            default: l(() => [
-              w(f(s.primaryButtonText || "Lend") + " again ", 1)
+            default: d(() => [
+              m(f(s.primaryButtonText || "Lend") + " again ", 1)
             ]),
             _: 1
-          }, 8, ["class"])) : d("", !0)
+          }, 8, ["class"])) : l("", !0)
         ], 2),
-        e.isLendAmountButton && !s.enableFiveDollarsNotes ? (i(), a(_, {
+        e.isLendAmountButton && !s.enableFiveDollarsNotes ? (i(), r(b, {
           key: 2,
           class: "tw-w-full",
           "loan-id": e.loanId,
@@ -545,23 +499,23 @@ function Z(t, n, s, p, h, e) {
           "amount-left": e.amountForLendAmountButton,
           "is-adding": s.isAdding,
           onAddToBasket: e.addToBasket
-        }, null, 8, ["loan-id", "amount-left", "is-adding", "onAddToBasket"])) : d("", !0),
-        !s.isLoading && s.isAdding ? (i(), a(c, {
+        }, null, 8, ["loan-id", "amount-left", "is-adding", "onAddToBasket"])) : l("", !0),
+        !s.isLoading && s.isAdding ? (i(), r(h, {
           key: 3,
           class: "tw-inline-flex tw-flex-1"
         }, {
-          default: l(() => n[7] || (n[7] = [
-            w(" Adding to basket ")
+          default: d(() => n[6] || (n[6] = [
+            m(" Adding to basket ")
           ])),
           _: 1
-        })) : d("", !0)
-      ], 10, E)
-    ], 32)) : d("", !0)
+        })) : l("", !0)
+      ], 10, R)
+    ], 32)) : l("", !0)
   ]);
 }
-const rt = /* @__PURE__ */ O(M, [["render", Z], ["__scopeId", "data-v-cc6815c8"]]);
+const ot = /* @__PURE__ */ N(O, [["render", j], ["__scopeId", "data-v-898962c3"]]);
 export {
-  it as KV_LEND_CTA_FRAGMENT,
-  at as KV_LEND_CTA_USER_FRAGMENT,
-  rt as default
+  nt as KV_LEND_CTA_FRAGMENT,
+  st as KV_LEND_CTA_USER_FRAGMENT,
+  ot as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "6.29.2",
+  "version": "6.30.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -111,5 +111,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "048dc13ccb276f6da7a3f2554215aef259788968"
+  "gitHead": "dcc1dba54ce0fe677ce67bc8ad5abe0c398df219"
 }