@kiva/kv-components 8.29.2 → 9.0.1

package/dist/vue/KvCardFrame2.js

@@ -1,9 +1,9 @@
 import { computed as r } from "vue";
-import { defaultTheme as t, stoneDarkTheme as a, stoneLightTheme as n, marigoldLightTheme as o, greenLightTheme as s, greenDarkTheme as l } from "@kiva/kv-tokens";
-import i from "./KvThemeProvider.js";
-const h = {
+import { defaultTheme as t, stoneLightTheme as a, marigoldLightTheme as o, greenLightTheme as n, greenDarkTheme as l } from "@kiva/kv-tokens";
+import s from "./KvThemeProvider.js";
+const m = {
   components: {
-    KvThemeProvider: i
+    KvThemeProvider: s
   },
   props: {
     allowOverflow: {
@@ -35,8 +35,7 @@ const h = {
           "greenLight",
           "greenDark",
           "marigoldLight",
-          "stoneLight",
-          "stoneDark"
+          "stoneLight"
         ].includes(e);
       }
     }
@@ -49,12 +48,10 @@ const h = {
         case "greenDark":
           return l;
         case "greenLight":
-          return s;
+          return n;
         case "marigoldLight":
           return o;
         case "stoneLight":
-          return n;
-        case "stoneDark":
           return a;
         default:
           return t;
@@ -63,5 +60,5 @@ const h = {
   }
 };
 export {
-  h as default
+  m as default
 };

package/dist/vue/KvCheckoutReceipt.css

@@ -1 +1 @@
-.section[data-v-63dc5a55]{border-bottom-width:.0625rem;border-top-width:0px;--tw-border-opacity: 1;border-color:rgba(var(--border-tertiary),var(--tw-border-opacity, 1));padding:.5rem;display:block;overflow:hidden}@media print{.section[data-v-63dc5a55]{page-break-inside:avoid}}.section--lender-info[data-v-63dc5a55]{padding-top:0}.section--print[data-v-63dc5a55]{border-bottom:0}.checkout-receipt__headline[data-v-63dc5a55]{text-align:center;margin-bottom:1.5rem}.checkout-receipt__item-list[data-v-63dc5a55]{list-style:none;margin:0;width:100%}.loan__name[data-v-63dc5a55]{margin-bottom:.5rem}.loan__name--inline[data-v-63dc5a55]{display:inline-block}.loan__amount[data-v-63dc5a55]{text-align:right}.total[data-v-63dc5a55]{display:flex;align-items:baseline}.total__header[data-v-63dc5a55],.total__amount[data-v-63dc5a55]{text-align:right;flex:1}.total__amount[data-v-63dc5a55]{flex-grow:.33}.payments[data-v-63dc5a55]{border-bottom:none}.payments__type[data-v-63dc5a55]{display:flex;text-align:right}.payments__type-title[data-v-63dc5a55],.payments__type-amount[data-v-63dc5a55]{flex:1}.print[data-v-63dc5a55]{margin:0 auto}
+.section[data-v-1d721061]{border-bottom-width:.0625rem;border-top-width:0px;--tw-border-opacity: 1;border-color:rgba(var(--border-tertiary),var(--tw-border-opacity, 1));padding:.5rem;display:block;overflow:hidden}@media print{.section[data-v-1d721061]{page-break-inside:avoid}}.section--lender-info[data-v-1d721061]{padding-top:0}.section--print[data-v-1d721061]{border-bottom:0}.checkout-receipt__headline[data-v-1d721061]{text-align:center;margin-bottom:1.5rem}.checkout-receipt__item-list[data-v-1d721061]{list-style:none;margin:0;width:100%}.loan__name[data-v-1d721061]{margin-bottom:.5rem}.loan__name--inline[data-v-1d721061]{display:inline-block}.loan__amount[data-v-1d721061]{text-align:right}.total[data-v-1d721061]{display:flex;align-items:baseline}.total__header[data-v-1d721061],.total__amount[data-v-1d721061]{text-align:right;flex:1}.total__amount[data-v-1d721061]{flex-grow:.33}.payments[data-v-1d721061]{border-bottom:none}.payments__type[data-v-1d721061]{display:flex;text-align:right}.payments__type-title[data-v-1d721061],.payments__type-amount[data-v-1d721061]{flex:1}.print[data-v-1d721061]{margin:0 auto}

package/dist/vue/KvCheckoutReceipt.js

@@ -1,5 +1,5 @@
 import C from "./KvCheckoutReceipt2.js";
-import { resolveComponent as m, resolveDirective as f, openBlock as s, createElementBlock as o, createElementVNode as e, toDisplayString as i, createCommentVNode as d, Fragment as c, renderList as k, createTextVNode as l, createVNode as p, withCtx as v, withDirectives as b } from "vue";
+import { resolveComponent as _, resolveDirective as f, openBlock as s, createElementBlock as o, createElementVNode as e, toDisplayString as i, createCommentVNode as d, Fragment as c, renderList as k, createTextVNode as l, createVNode as p, withCtx as v, withDirectives as b } from "vue";
 import "./KvCheckoutReceipt.css";
 import x from "../_virtual/_plugin-vue_export-helper.js";
 const g = { class: "checkout-receipt" }, T = { class: "checkout-receipt__wrapper tw-bg-primary tw-p-4 tw-rounded-xs tw-border tw-border-tertiary" }, j = {
@@ -33,24 +33,24 @@ const g = { class: "checkout-receipt" }, T = { class: "checkout-receipt__wrapper
 }, B = {
   "data-testid": "kcard",
   class: "loan kcard"
-}, U = {
+}, L = {
   class: "loan__details data-hj-suppress",
   "data-testid": "kcard-details"
-}, q = {
+}, U = {
   key: 0,
   "data-testid": "kcard-details",
   class: "loan__details data-hj-suppress"
-}, z = {
+}, q = {
   class: "loan__details data-hj-suppress",
   "data-testid": "kcard-details"
-}, L = {
+}, z = {
   class: "loan__amount tw-text-title",
   "data-testid": "kcard-amount"
-}, S = {
+}, G = {
   key: 0,
   "data-testid": "kcard-portfolio",
   class: "section tw-text-center print:!tw-hidden"
-}, W = { href: "/portfolio/kiva-cards" }, Y = { class: "checkout-receipt__item-list" }, G = { class: "section" }, H = {
+}, S = { href: "/portfolio/kiva-cards" }, W = { class: "checkout-receipt__item-list" }, Y = { class: "section" }, H = {
   class: "loan",
   "data-testid": "donation"
 }, J = {
@@ -102,8 +102,8 @@ const g = { class: "checkout-receipt" }, T = { class: "checkout-receipt__wrapper
   class: "total__amount tw-text-title",
   "data-testid": "amount-charged-payment-amount"
 }, ct = { class: "section section--print print:!tw-hidden" };
-function pt(mt, t, n, _, _t, r) {
-  const u = m("kv-material-icon"), y = m("kv-tooltip"), w = m("kv-button"), h = f("kv-track-event");
+function pt(_t, t, n, m, mt, r) {
+  const u = _("kv-material-icon"), y = _("kv-tooltip"), w = _("kv-button"), h = f("kv-track-event");
   return s(), o("div", g, [
     t[25] || (t[25] = e("h2", { class: "checkout-receipt__headline" }, " Order Confirmation ", -1)),
     e("div", T, [
@@ -160,7 +160,7 @@ function pt(mt, t, n, _, _t, r) {
                   }, " Print-it-yourself Kiva Card ", -1)),
                   p(u, {
                     id: `print-card-${a.id}`,
-                    icon: _.infoIcon,
+                    icon: m.infoIcon,
                     "data-testid": "kcard-tool-tip-control",
                     name: "question",
                     class: "tw-fill-current tw-text-tertiary tw-h-2.5 tw-w-2.5 tw-ml-0.5"
@@ -168,7 +168,7 @@ function pt(mt, t, n, _, _t, r) {
                   p(y, {
                     "data-testid": "kcard-tool-tip-text",
                     controller: `print-card-${a.id}`,
-                    theme: "mint"
+                    theme: "ecoGreenLight"
                   }, {
                     default: v(() => t[2] || (t[2] = [
                       l(" You can print this card now. We'll also send it to you in an email so you can print it later. ")
@@ -193,7 +193,7 @@ function pt(mt, t, n, _, _t, r) {
                   class: "loan__name tw-text-title",
                   "data-testid": "kcard-type-postal"
                 }, " Postal delivery Kiva Card ", -1)),
-                e("div", U, [
+                e("div", L, [
                   l(" For: " + i(a.kivaCardObject.mailingInfo.firstName) + " " + i(a.kivaCardObject.mailingInfo.lastName), 1),
                   t[6] || (t[6] = e("br", null, null, -1)),
                   l(" " + i(a.kivaCardObject.mailingInfo.address), 1),
@@ -209,13 +209,13 @@ function pt(mt, t, n, _, _t, r) {
                   class: "loan__name tw-text-title",
                   "data-testid": "kcard-type-lender"
                 }, " Kiva Card ", -1)),
-                a.kivaCardObject.recipient.name ? (s(), o("div", q, " For: " + i(a.kivaCardObject.recipient.name), 1)) : d("", !0)
+                a.kivaCardObject.recipient.name ? (s(), o("div", U, " For: " + i(a.kivaCardObject.recipient.name), 1)) : d("", !0)
               ], 64)) : a.kivaCardObject.deliveryType === "email" ? (s(), o(c, { key: 3 }, [
                 t[11] || (t[11] = e("h3", {
                   class: "loan__name tw-text-title",
                   "data-testid": "kcard-type-email"
                 }, " Email delivery Kiva Card ", -1)),
-                e("div", z, [
+                e("div", q, [
                   t[10] || (t[10] = l(" For: ")),
                   a.kivaCardObject.recipient.name ? (s(), o(c, { key: 0 }, [
                     l(i(a.kivaCardObject.recipient.name) + " – ", 1)
@@ -223,12 +223,12 @@ function pt(mt, t, n, _, _t, r) {
                   l(" " + i(a.kivaCardObject.recipient.email), 1)
                 ])
               ], 64)) : d("", !0),
-              e("div", L, " $" + i(a.price), 1)
+              e("div", z, " $" + i(a.price), 1)
             ])
           ]))), 128)),
-          r.kivaCards.length > 0 ? (s(), o("li", S, [
+          r.kivaCards.length > 0 ? (s(), o("li", G, [
             t[13] || (t[13] = l(" For more details about all your Kiva Card purchases, please visit your ")),
-            b((s(), o("a", W, t[12] || (t[12] = [
+            b((s(), o("a", S, t[12] || (t[12] = [
               l(" Kiva portfolio ")
             ]))), [
               [h, ["Thanks", "click", "kiva-card-portfolio"]]
@@ -238,8 +238,8 @@ function pt(mt, t, n, _, _t, r) {
         ])
       ]),
       e("section", null, [
-        e("ul", Y, [
-          e("li", G, [
+        e("ul", W, [
+          e("li", Y, [
             e("div", H, [
               t[15] || (t[15] = e("h3", { class: "loan__name tw-text-title" }, " Donation to Kiva ", -1)),
               n.receipt.totals.donationTotal > 0 ? (s(), o("a", {
@@ -297,7 +297,7 @@ function pt(mt, t, n, _, _t, r) {
           onClick: t[1] || (t[1] = (...a) => r.printReceipt && r.printReceipt(...a))
         }, [
           p(u, {
-            icon: _.printIcon,
+            icon: m.printIcon,
             name: "print",
             class: "tw-h-2.5 tw-w-2.5 tw-ml-0.5"
           }, null, 8, ["icon"]),
@@ -307,7 +307,7 @@ function pt(mt, t, n, _, _t, r) {
     ])
   ]);
 }
-const wt = /* @__PURE__ */ x(C, [["render", pt], ["__scopeId", "data-v-63dc5a55"]]);
+const wt = /* @__PURE__ */ x(C, [["render", pt], ["__scopeId", "data-v-1d721061"]]);
 export {
   wt as default
 };

package/dist/vue/KvDatePicker2.js

@@ -1,12 +1,12 @@
 import { computed as r } from "vue";
 import a from "@vuepic/vue-datepicker";
 import "@vuepic/vue-datepicker/dist/main.css";
-import { defaultTheme as t, stoneDarkTheme as n, stoneLightTheme as m, marigoldLightTheme as i, greenLightTheme as h, greenDarkTheme as o } from "@kiva/kv-tokens";
-import s from "./KvThemeProvider.js";
-const f = {
+import { defaultTheme as t, stoneLightTheme as i, marigoldLightTheme as m, greenLightTheme as n, greenDarkTheme as h } from "@kiva/kv-tokens";
+import l from "./KvThemeProvider.js";
+const p = {
   name: "KvDatePicker",
   components: {
-    KvThemeProvider: s,
+    KvThemeProvider: l,
     VueDatePicker: a
   },
   inheritAttrs: !1,
@@ -24,8 +24,7 @@ const f = {
           "greenLight",
           "greenDark",
           "marigoldLight",
-          "stoneLight",
-          "stoneDark"
+          "stoneLight"
         ].includes(e);
       }
     }
@@ -40,15 +39,13 @@ const f = {
         case "default":
           return t;
         case "greenDark":
-          return o;
-        case "greenLight":
           return h;
+        case "greenLight":
+          return n;
         case "marigoldLight":
-          return i;
-        case "stoneLight":
           return m;
-        case "stoneDark":
-          return n;
+        case "stoneLight":
+          return i;
         default:
           return t;
       }
@@ -74,5 +71,5 @@ const f = {
   }
 };
 export {
-  f as default
+  p as default
 };

package/dist/vue/KvSecondaryNav.css

@@ -1 +1 @@
-.kv-secondary-nav-holder[data-v-4543890b]{height:62px}.kv-secondary-nav[data-v-4543890b]{min-height:62px}
+.kv-secondary-nav-holder[data-v-dcf22089]{height:62px}.kv-secondary-nav[data-v-dcf22089]{min-height:62px}

package/dist/vue/KvSecondaryNav.js

@@ -83,7 +83,7 @@ function N(p, w, t, e, E, A) {
     _: 1
   }, 8, ["theme"]);
 }
-const z = /* @__PURE__ */ C(x, [["render", N], ["__scopeId", "data-v-4543890b"]]);
+const z = /* @__PURE__ */ C(x, [["render", N], ["__scopeId", "data-v-dcf22089"]]);
 export {
   z as default
 };

package/dist/vue/KvSecondaryNav2.js

@@ -1,13 +1,13 @@
 import { toRefs as c, ref as g, computed as n } from "vue";
-import { stoneLightTheme as p, marigoldLightTheme as b, greenDarkTheme as u, greenLightTheme as v, defaultTheme as w } from "@kiva/kv-tokens";
-import { mdiChevronDown as k, mdiChevronUp as C } from "@mdi/js";
-import L from "./KvThemeProvider.js";
+import { stoneLightTheme as y, marigoldLightTheme as p, greenDarkTheme as b, greenLightTheme as v, defaultTheme as w } from "@kiva/kv-tokens";
+import { mdiChevronDown as k, mdiChevronUp as L } from "@mdi/js";
+import C from "./KvThemeProvider.js";
 import j from "./KvMaterialIcon.js";
 import O from "./KvPageContainer.js";
 const _ = {
   name: "KvSecondaryNav",
   components: {
-    KvThemeProvider: L,
+    KvThemeProvider: C,
     KvMaterialIcon: j,
     KvPageContainer: O
   },
@@ -46,7 +46,6 @@ const _ = {
       validator(e) {
         return [
           "default",
-          "dark",
           "greenLight",
           "greenDark",
           "marigoldLight",
@@ -63,14 +62,13 @@ const _ = {
       heading: l,
       linkAlignment: a,
       theme: s
-    } = c(e), d = g(null), i = g(!1), m = n(() => e.headingLink && e.headingLink.href), h = n(() => a.value === "right" ? l.value && l.value.length > 0 ? "tw-justify-between" : "tw-justify-between md:tw-justify-end" : a.value === "left" ? "tw-justify-between md:tw-justify-start" : a.value === "center" ? "tw-justify-between md:tw-justify-center" : ""), o = {
+    } = c(e), u = g(null), i = g(!1), m = n(() => e.headingLink && e.headingLink.href), d = n(() => a.value === "right" ? l.value && l.value.length > 0 ? "tw-justify-between" : "tw-justify-between md:tw-justify-end" : a.value === "left" ? "tw-justify-between md:tw-justify-start" : a.value === "center" ? "tw-justify-between md:tw-justify-center" : ""), o = {
       default: { style: w, bgClass: "tw-bg-secondary" },
-      dark: { style: u, bgClass: "tw-bg-primary" },
       greenLight: { style: v, bgClass: "tw-bg-secondary" },
-      greenDark: { style: u, bgClass: "tw-bg-primary" },
-      marigoldLight: { style: b, bgClass: "tw-bg-primary" },
-      stoneLight: { style: p, bgClass: "tw-bg-primary" }
-    }, y = n(() => {
+      greenDark: { style: b, bgClass: "tw-bg-primary" },
+      marigoldLight: { style: p, bgClass: "tw-bg-primary" },
+      stoneLight: { style: y, bgClass: "tw-bg-primary" }
+    }, h = n(() => {
       var t;
       return (t = o[s.value]) == null ? void 0 : t.style;
     }), f = n(() => {
@@ -79,15 +77,15 @@ const _ = {
     });
     return {
       hasHeadingLink: m,
-      navAlignmentClass: h,
+      navAlignmentClass: d,
       toggleSubNavigation: () => {
         i.value = !i.value;
       },
       subNavigationOpen: i,
-      mdiChevronUp: C,
+      mdiChevronUp: L,
       mdiChevronDown: k,
-      subNavigation: d,
-      themeStyle: y,
+      subNavigation: u,
+      themeStyle: h,
       bgClass: f,
       handleLinkClick: (t) => {
         r("subnavLinkClicked", t);

package/dist/vue/KvTooltip.css

@@ -1 +1 @@
-.tooltip-pane[data-v-5fd76cc8],.tooltip-arrow[data-v-5fd76cc8]{box-shadow:0 4px 12px #00000014}.tooltip-arrow[data-v-5fd76cc8]{margin:.5rem;border-color:rgba(var(--bg-primary),var(--tw-bg-opacity, 1))}.tooltip-pane[x-placement^=top][data-v-5fd76cc8]{margin-bottom:.5rem}.tooltip-pane[x-placement^=top] .tooltip-arrow[data-v-5fd76cc8]{border-width:8px 8px 0 8px;border-left-color:transparent;border-right-color:transparent;border-bottom-color:transparent;left:calc(50% - 8px);bottom:-.5rem;margin-top:0;margin-bottom:0}.tooltip-pane[x-placement^=bottom][data-v-5fd76cc8]{margin-top:.5rem}.tooltip-pane[x-placement^=bottom] .tooltip-arrow[data-v-5fd76cc8]{border-width:0 8px 8px 8px;border-left-color:transparent;border-right-color:transparent;border-top-color:transparent;left:calc(50% - 8px);top:-.5rem;margin-bottom:0;margin-top:0}.tooltip-pane[x-placement^=right][data-v-5fd76cc8]{margin-left:.5rem}.tooltip-pane[x-placement^=right] .tooltip-arrow[data-v-5fd76cc8]{border-width:8px 8px 8px 0;border-left-color:transparent;border-top-color:transparent;border-bottom-color:transparent;top:calc(50% - 8px);left:-.5rem;margin-left:0;margin-right:0}.tooltip-pane[x-placement^=left][data-v-5fd76cc8]{margin-right:.5rem}.tooltip-pane[x-placement^=left] .tooltip-arrow[data-v-5fd76cc8]{border-width:8px 0 8px 8px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;top:calc(50% - 8px);right:-.5rem;margin-left:0;margin-right:0}
+.tooltip-pane[data-v-d5f691f8],.tooltip-arrow[data-v-d5f691f8]{box-shadow:0 4px 12px #00000014}.tooltip-arrow[data-v-d5f691f8]{margin:.5rem;border-color:rgba(var(--bg-primary),var(--tw-bg-opacity, 1))}.tooltip-pane[x-placement^=top][data-v-d5f691f8]{margin-bottom:.5rem}.tooltip-pane[x-placement^=top] .tooltip-arrow[data-v-d5f691f8]{border-width:8px 8px 0 8px;border-left-color:transparent;border-right-color:transparent;border-bottom-color:transparent;left:calc(50% - 8px);bottom:-.5rem;margin-top:0;margin-bottom:0}.tooltip-pane[x-placement^=bottom][data-v-d5f691f8]{margin-top:.5rem}.tooltip-pane[x-placement^=bottom] .tooltip-arrow[data-v-d5f691f8]{border-width:0 8px 8px 8px;border-left-color:transparent;border-right-color:transparent;border-top-color:transparent;left:calc(50% - 8px);top:-.5rem;margin-bottom:0;margin-top:0}.tooltip-pane[x-placement^=right][data-v-d5f691f8]{margin-left:.5rem}.tooltip-pane[x-placement^=right] .tooltip-arrow[data-v-d5f691f8]{border-width:8px 8px 8px 0;border-left-color:transparent;border-top-color:transparent;border-bottom-color:transparent;top:calc(50% - 8px);left:-.5rem;margin-left:0;margin-right:0}.tooltip-pane[x-placement^=left][data-v-d5f691f8]{margin-right:.5rem}.tooltip-pane[x-placement^=left] .tooltip-arrow[data-v-d5f691f8]{border-width:8px 0 8px 8px;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;top:calc(50% - 8px);right:-.5rem;margin-left:0;margin-right:0}

package/dist/vue/KvTooltip.js

@@ -1,5 +1,5 @@
-import c from "./KvTooltip2.js";
-import { resolveComponent as l, openBlock as p, createBlock as v, withCtx as n, createVNode as f, createElementVNode as i, normalizeStyle as w, createElementBlock as _, renderSlot as d, createCommentVNode as u } from "vue";
+import f from "./KvTooltip2.js";
+import { resolveComponent as l, openBlock as p, createBlock as v, withCtx as n, createVNode as c, createElementVNode as i, normalizeStyle as w, createElementBlock as _, renderSlot as d, createCommentVNode as u } from "vue";
 import "./KvTooltip.css";
 import k from "../_virtual/_plugin-vue_export-helper.js";
 const y = {
@@ -13,7 +13,7 @@ function b(o, e, r, t, x, V) {
     class: "kv-tailwind"
   }, {
     default: n(() => [
-      f(s, {
+      c(s, {
         ref: "popperRef",
         controller: r.controller,
         "popper-modifiers": t.popperModifiers,
@@ -46,7 +46,7 @@ function b(o, e, r, t, x, V) {
     _: 3
   }, 8, ["theme"]);
 }
-const N = /* @__PURE__ */ k(c, [["render", b], ["__scopeId", "data-v-5fd76cc8"]]);
+const N = /* @__PURE__ */ k(f, [["render", b], ["__scopeId", "data-v-d5f691f8"]]);
 export {
   N as default
 };

package/dist/vue/KvTooltip2.js

@@ -1,12 +1,12 @@
-import { toRefs as S, computed as i, ref as b, watch as M } from "vue";
-import { darkTheme as l, mintTheme as a, stoneDarkTheme as m, stoneLightTheme as p, marigoldLightTheme as f, greenDarkTheme as s, greenLightTheme as u, defaultTheme as d } from "@kiva/kv-tokens";
-import D from "./KvPopper.js";
-import E from "./KvThemeProvider.js";
-const H = {
+import { toRefs as L, computed as i, ref as w, watch as b } from "vue";
+import { stoneLightTheme as l, marigoldLightTheme as p, greenDarkTheme as a, greenLightTheme as f, defaultTheme as m } from "@kiva/kv-tokens";
+import M from "./KvPopper.js";
+import S from "./KvThemeProvider.js";
+const K = {
   name: "KvTooltip",
   components: {
-    KvPopper: D,
-    KvThemeProvider: E
+    KvPopper: M,
+    KvThemeProvider: S
   },
   props: {
     controller: {
@@ -41,63 +41,54 @@ const H = {
           "ecoGreenLight",
           "ecoGreenDark",
           "ecoLightMarigold",
-          "ecoStoneLight",
-          "ecoStoneDark",
-          "mint",
-          "dark"
+          "ecoStoneLight"
         ].indexOf(e) !== -1;
       }
     }
   },
   emits: ["tool-tip-visible"],
-  setup(e, { emit: c }) {
+  setup(e, { emit: u }) {
     const {
       modifiers: r,
-      showTooltip: h,
-      theme: g
-    } = S(e), v = i(() => ({
+      showTooltip: s,
+      theme: c
+    } = L(e), d = i(() => ({
       ...r.value,
       preventOverflow: {
         ...r.value.preventOverflow,
         padding: 10
       }
-    })), T = b(null), y = () => typeof e.controller == "string" ? document.getElementById(e.controller) : e.controller, L = (t) => {
-      c("tool-tip-visible", t);
+    })), h = w(null), g = () => typeof e.controller == "string" ? document.getElementById(e.controller) : e.controller, v = (t) => {
+      u("tool-tip-visible", t);
     }, o = (t = !0) => {
-      const n = y();
+      const n = g();
       if (n) {
-        const k = t ? "mouseover" : "mouseout";
-        n.dispatchEvent(new MouseEvent(k, { bubbles: !0 }));
+        const T = t ? "mouseover" : "mouseout";
+        n.dispatchEvent(new MouseEvent(T, { bubbles: !0 }));
       }
-    }, w = i(() => ({
-      default: d,
-      ecoGreenLight: u,
-      ecoGreenDark: s,
-      ecoLightMarigold: f,
-      ecoStoneLight: p,
-      ecoStoneDark: m,
-      mint: a,
-      dark: l
-    })[g.value]);
-    return M(h, (t) => {
+    }, y = i(() => ({
+      default: m,
+      ecoGreenLight: f,
+      ecoGreenDark: a,
+      ecoLightMarigold: p,
+      ecoStoneLight: l
+    })[c.value]);
+    return b(s, (t) => {
       o(!!t);
     }), {
-      defaultTheme: d,
-      greenLightTheme: u,
-      greenDarkTheme: s,
-      marigoldLightTheme: f,
-      stoneLightTheme: p,
-      stoneDarkTheme: m,
-      mintTheme: a,
-      darkTheme: l,
-      handleKvPopperVisibility: L,
-      popperModifiers: v,
-      popperRef: T,
-      themeStyle: w,
+      defaultTheme: m,
+      greenLightTheme: f,
+      greenDarkTheme: a,
+      marigoldLightTheme: p,
+      stoneLightTheme: l,
+      handleKvPopperVisibility: v,
+      popperModifiers: d,
+      popperRef: h,
+      themeStyle: y,
       triggerHover: o
     };
   }
 };
 export {
-  H as default
+  K as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "8.29.2",
+  "version": "9.0.1",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -33,7 +33,7 @@
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
     "@figma/code-connect": "^1.4.9",
-    "@kiva/kv-tokens": "^4.4.1",
+    "@kiva/kv-tokens": "^5.0.0",
     "@kiva/vite-plugin-vue-lib-css": "^2.0.0",
     "@laynezh/vite-plugin-lib-assets": "^0.6.1",
     "@mdi/js": "^7.4.47",
@@ -91,7 +91,7 @@
   },
   "peerDependencies": {
     "@apollo/client": "3.x",
-    "@kiva/kv-tokens": "4.x",
+    "@kiva/kv-tokens": "4.x || 5.x",
     "@mdi/js": "7.x",
     "@vuepic/vue-datepicker": "^11.0.2",
     "@vueuse/integrations": "14.x",
@@ -113,5 +113,5 @@
   "dependencies": {
     "fuse.js": "^7.1.0"
   },
-  "gitHead": "f66324e85b8e2c3265606c8aecd3bc2b5e0b74a8"
+  "gitHead": "69683ca43b93c2774b73feb9b7337ff30f19b836"
 }