@kiva/kv-components 6.45.1 → 6.46.0

package/dist/index.js

@@ -23,89 +23,90 @@ import { default as z } from "./vue/KvExpandableQuestion.js";
 import { default as q } from "./vue/KvFlag.js";
 import { default as X } from "./vue/KvGrid.js";
 import { default as Z } from "./vue/KvImpactDashboardHeader.js";
-import { default as ee } from "./vue/KvInlineActivityCard.js";
-import { default as te } from "./vue/KvInlineActivityFeed.js";
-import { KV_INTRODUCTION_LOAN_CARD_FRAGMENT as ae, KV_INTRODUCTION_LOAN_CARD_USER_FRAGMENT as fe, default as le } from "./vue/KvIntroductionLoanCard.js";
-import { default as de } from "./vue/KvLendAmountButton.js";
-import { KV_LEND_CTA_FRAGMENT as pe, KV_LEND_CTA_USER_FRAGMENT as ue, default as xe } from "./vue/KvLendCta.js";
-import { default as Ke } from "./vue/KvLightbox.js";
-import { default as Ae } from "./vue/KvLineGraph.js";
-import { KV_LOAN_ACTIVITIES_FRAGMENT as Ce, default as _e } from "./vue/KvLoanActivities.js";
-import { KV_LOAN_BOOKMARK_FRAGMENT as Ne, default as Te } from "./vue/KvLoanBookmark.js";
-import { default as Ee } from "./vue/KvLoanCallouts.js";
-import { default as Me } from "./vue/KvLoanProgressGroup.js";
-import { KV_LOAN_TAG_FRAGMENT as Se, default as Ie } from "./vue/KvLoanTag.js";
-import { default as ge } from "./vue/KvLoanTeamPick.js";
-import { KV_LOAN_USE_FRAGMENT as he, default as Fe } from "./vue/KvLoanUse.js";
-import { default as Be } from "./vue/KvLoadingPlaceholder.js";
-import { default as ke } from "./vue/KvLoadingSpinner.js";
-import { default as be } from "./vue/KvMap.js";
-import { default as we } from "./vue/KvMaterialIcon.js";
-import { default as He } from "./vue/KvPageContainer.js";
-import { default as ze } from "./vue/KvPagination.js";
-import { default as qe } from "./vue/KvPieChart.js";
-import { default as Xe } from "./vue/KvPill.js";
-import { default as Ze } from "./vue/KvPopper.js";
-import { default as eo } from "./vue/KvProgressBar.js";
-import { default as to } from "./vue/KvPulsingDot.js";
-import { default as ao } from "./vue/KvRadio.js";
-import { default as lo } from "./vue/KvSelect.js";
-import { default as mo } from "./vue/KvSideSheet.js";
-import { default as uo } from "./vue/KvSwitch.js";
-import { default as no } from "./vue/KvTab.js";
-import { default as vo } from "./vue/KvTabPanel.js";
-import { default as io } from "./vue/KvTabs.js";
-import { default as _o } from "./vue/KvTextInput.js";
-import { default as No } from "./vue/KvTextLink.js";
-import { default as co } from "./vue/KvThemeProvider.js";
-import { default as Ro } from "./vue/KvToast.js";
-import { default as Oo } from "./vue/KvTooltip.js";
-import { default as Io } from "./vue/KvTreeMapChart.js";
-import { default as go } from "./vue/KvUserAvatar.js";
-import { default as ho } from "./vue/KvUtilityMenu.js";
-import { default as Vo } from "./vue/KvVerticalCarousel.js";
-import { default as Do } from "./vue/KvVotingCard.js";
-import { default as yo } from "./vue/KvVotingCardV2.js";
-import { KV_WIDE_LOAN_CARD_FRAGMENT as Uo, KV_WIDE_LOAN_CARD_USER_FRAGMENT as wo, default as Wo } from "./vue/KvWideLoanCard.js";
-import { default as jo } from "./vue/KvAtbModal.js";
-import { default as Qo } from "./vue/KvSecondaryNav.js";
-import { default as Jo } from "./vue/KvWwwHeader.js";
-import { default as Yo, Mash as Zo } from "./utils/Alea.js";
-import { useAttrs as et } from "./utils/attrs.js";
-import { carouselUtil as tt } from "./utils/carousels.js";
-import { collapse as at, expand as ft } from "./utils/expander.js";
-import { isLegacyPlaceholderAvatar as st, randomizedUserAvatarClass as dt } from "./utils/imageUtils.js";
-import { LOAN_CALLOUTS_FRAGMENT as pt, LOAN_GEOCODE_FRAGMENT as ut, LOAN_PROGRESS_FRAGMENT as xt, loanCardComputedProperties as nt, loanCardMethods as Kt } from "./utils/loanCard.js";
-import { BALANCE_CAMPAIGN as At, BASE_CAMPAIGN as it, ERL_COOKIE_NAME as Ct, NO_BALANCE_CAMPAIGN as _t, TOP_UP_CAMPAIGN as Lt, getDropdownPriceArray as Nt, getLendCtaSelectedOption as Tt, isBetween25And50 as ct, isLessThan25 as Et } from "./utils/loanUtils.js";
-import { animationCoordinator as Mt, generateMapMarkers as Ot, getCoordinatesBetween as St, getCountryColor as It, getLoansIntervals as Pt } from "./utils/mapUtils.js";
-import { lockPrintSingleEl as Gt, unlockPrintSingleEl as ht } from "./utils/printing.js";
-import { lockScroll as Vt, lockScrollSmallOnly as Bt, unlockScroll as Dt, unlockScrollSmallOnly as kt } from "./utils/scrollLock.js";
-import { buildTailwindClassName as bt, headerNumberCase as Ut, kebabCase as wt, removeObjectProperty as Wt } from "./utils/themeUtils.js";
-import { throttle as jt } from "./utils/throttle.js";
-import { isTargetElement as Qt, offBodyTouchstart as qt, onBodyTouchstart as Jt } from "./utils/touchEvents.js";
-import { getTreemap as Yt } from "./utils/treemap.js";
-import { KvBlueskyIcon as $t } from "./assets/icons/bluesky.js";
+import { default as ee } from "./vue/KvImpactVerticalSelector.js";
+import { default as te } from "./vue/KvInlineActivityCard.js";
+import { default as ae } from "./vue/KvInlineActivityFeed.js";
+import { KV_INTRODUCTION_LOAN_CARD_FRAGMENT as le, KV_INTRODUCTION_LOAN_CARD_USER_FRAGMENT as se, default as de } from "./vue/KvIntroductionLoanCard.js";
+import { default as pe } from "./vue/KvLendAmountButton.js";
+import { KV_LEND_CTA_FRAGMENT as xe, KV_LEND_CTA_USER_FRAGMENT as ne, default as Ke } from "./vue/KvLendCta.js";
+import { default as Ae } from "./vue/KvLightbox.js";
+import { default as Ce } from "./vue/KvLineGraph.js";
+import { KV_LOAN_ACTIVITIES_FRAGMENT as Le, default as Ne } from "./vue/KvLoanActivities.js";
+import { KV_LOAN_BOOKMARK_FRAGMENT as ce, default as Ee } from "./vue/KvLoanBookmark.js";
+import { default as Me } from "./vue/KvLoanCallouts.js";
+import { default as Se } from "./vue/KvLoanProgressGroup.js";
+import { KV_LOAN_TAG_FRAGMENT as Pe, default as ge } from "./vue/KvLoanTag.js";
+import { default as he } from "./vue/KvLoanTeamPick.js";
+import { KV_LOAN_USE_FRAGMENT as Ve, default as Be } from "./vue/KvLoanUse.js";
+import { default as ke } from "./vue/KvLoadingPlaceholder.js";
+import { default as be } from "./vue/KvLoadingSpinner.js";
+import { default as we } from "./vue/KvMap.js";
+import { default as He } from "./vue/KvMaterialIcon.js";
+import { default as ze } from "./vue/KvPageContainer.js";
+import { default as qe } from "./vue/KvPagination.js";
+import { default as Xe } from "./vue/KvPieChart.js";
+import { default as Ze } from "./vue/KvPill.js";
+import { default as eo } from "./vue/KvPopper.js";
+import { default as to } from "./vue/KvProgressBar.js";
+import { default as ao } from "./vue/KvPulsingDot.js";
+import { default as lo } from "./vue/KvRadio.js";
+import { default as mo } from "./vue/KvSelect.js";
+import { default as uo } from "./vue/KvSideSheet.js";
+import { default as no } from "./vue/KvSwitch.js";
+import { default as vo } from "./vue/KvTab.js";
+import { default as io } from "./vue/KvTabPanel.js";
+import { default as _o } from "./vue/KvTabs.js";
+import { default as No } from "./vue/KvTextInput.js";
+import { default as co } from "./vue/KvTextLink.js";
+import { default as Ro } from "./vue/KvThemeProvider.js";
+import { default as Oo } from "./vue/KvToast.js";
+import { default as Io } from "./vue/KvTooltip.js";
+import { default as go } from "./vue/KvTreeMapChart.js";
+import { default as ho } from "./vue/KvUserAvatar.js";
+import { default as Vo } from "./vue/KvUtilityMenu.js";
+import { default as Do } from "./vue/KvVerticalCarousel.js";
+import { default as yo } from "./vue/KvVotingCard.js";
+import { default as Uo } from "./vue/KvVotingCardV2.js";
+import { KV_WIDE_LOAN_CARD_FRAGMENT as Wo, KV_WIDE_LOAN_CARD_USER_FRAGMENT as Ho, default as jo } from "./vue/KvWideLoanCard.js";
+import { default as Qo } from "./vue/KvAtbModal.js";
+import { default as Jo } from "./vue/KvSecondaryNav.js";
+import { default as Yo } from "./vue/KvWwwHeader.js";
+import { default as $o, Mash as et } from "./utils/Alea.js";
+import { useAttrs as tt } from "./utils/attrs.js";
+import { carouselUtil as at } from "./utils/carousels.js";
+import { collapse as lt, expand as st } from "./utils/expander.js";
+import { isLegacyPlaceholderAvatar as mt, randomizedUserAvatarClass as pt } from "./utils/imageUtils.js";
+import { LOAN_CALLOUTS_FRAGMENT as xt, LOAN_GEOCODE_FRAGMENT as nt, LOAN_PROGRESS_FRAGMENT as Kt, loanCardComputedProperties as vt, loanCardMethods as At } from "./utils/loanCard.js";
+import { BALANCE_CAMPAIGN as Ct, BASE_CAMPAIGN as _t, ERL_COOKIE_NAME as Lt, NO_BALANCE_CAMPAIGN as Nt, TOP_UP_CAMPAIGN as Tt, getDropdownPriceArray as ct, getLendCtaSelectedOption as Et, isBetween25And50 as Rt, isLessThan25 as Mt } from "./utils/loanUtils.js";
+import { animationCoordinator as St, generateMapMarkers as It, getCoordinatesBetween as Pt, getCountryColor as gt, getLoansIntervals as Gt } from "./utils/mapUtils.js";
+import { lockPrintSingleEl as Ft, unlockPrintSingleEl as Vt } from "./utils/printing.js";
+import { lockScroll as Dt, lockScrollSmallOnly as kt, unlockScroll as yt, unlockScrollSmallOnly as bt } from "./utils/scrollLock.js";
+import { buildTailwindClassName as wt, headerNumberCase as Wt, kebabCase as Ht, removeObjectProperty as jt } from "./utils/themeUtils.js";
+import { throttle as Qt } from "./utils/throttle.js";
+import { isTargetElement as Jt, offBodyTouchstart as Xt, onBodyTouchstart as Yt } from "./utils/touchEvents.js";
+import { getTreemap as $t } from "./utils/treemap.js";
+import { KvBlueskyIcon as or } from "./assets/icons/bluesky.js";
 export {
-  Yo as Alea,
-  At as BALANCE_CAMPAIGN,
-  it as BASE_CAMPAIGN,
-  Ct as ERL_COOKIE_NAME,
+  $o as Alea,
+  Ct as BALANCE_CAMPAIGN,
+  _t as BASE_CAMPAIGN,
+  Lt as ERL_COOKIE_NAME,
   E as KV_CLASSIC_LOAN_CARD_FRAGMENT,
   R as KV_CLASSIC_LOAN_CARD_USER_FRAGMET,
-  ae as KV_INTRODUCTION_LOAN_CARD_FRAGMENT,
-  fe as KV_INTRODUCTION_LOAN_CARD_USER_FRAGMENT,
-  pe as KV_LEND_CTA_FRAGMENT,
-  ue as KV_LEND_CTA_USER_FRAGMENT,
-  Ce as KV_LOAN_ACTIVITIES_FRAGMENT,
-  Ne as KV_LOAN_BOOKMARK_FRAGMENT,
-  Se as KV_LOAN_TAG_FRAGMENT,
-  he as KV_LOAN_USE_FRAGMENT,
-  Uo as KV_WIDE_LOAN_CARD_FRAGMENT,
-  wo as KV_WIDE_LOAN_CARD_USER_FRAGMENT,
+  le as KV_INTRODUCTION_LOAN_CARD_FRAGMENT,
+  se as KV_INTRODUCTION_LOAN_CARD_USER_FRAGMENT,
+  xe as KV_LEND_CTA_FRAGMENT,
+  ne as KV_LEND_CTA_USER_FRAGMENT,
+  Le as KV_LOAN_ACTIVITIES_FRAGMENT,
+  ce as KV_LOAN_BOOKMARK_FRAGMENT,
+  Pe as KV_LOAN_TAG_FRAGMENT,
+  Ve as KV_LOAN_USE_FRAGMENT,
+  Wo as KV_WIDE_LOAN_CARD_FRAGMENT,
+  Ho as KV_WIDE_LOAN_CARD_USER_FRAGMENT,
   t as KvAccordionItem,
   a as KvActivityRow,
-  jo as KvAtbModal,
-  $t as KvBlueskyIcon,
+  Qo as KvAtbModal,
+  or as KvBlueskyIcon,
   l as KvBorrowerImage,
   d as KvButton,
   p as KvCardFrame,
@@ -129,88 +130,89 @@ export {
   q as KvFlag,
   X as KvGrid,
   Z as KvImpactDashboardHeader,
-  ee as KvInlineActivityCard,
-  te as KvInlineActivityFeed,
-  le as KvIntroductionLoanCard,
-  de as KvLendAmountButton,
-  xe as KvLendCta,
-  Ke as KvLightbox,
-  Ae as KvLineGraph,
-  Be as KvLoadingPlaceholder,
-  ke as KvLoadingSpinner,
-  _e as KvLoanActivities,
-  Te as KvLoanBookmark,
-  Ee as KvLoanCallouts,
-  Me as KvLoanProgressGroup,
-  Ie as KvLoanTag,
-  ge as KvLoanTeamPick,
-  Fe as KvLoanUse,
-  be as KvMap,
-  we as KvMaterialIcon,
-  He as KvPageContainer,
-  ze as KvPagination,
-  qe as KvPieChart,
-  Xe as KvPill,
-  Ze as KvPopper,
-  eo as KvProgressBar,
-  to as KvPulsingDot,
-  ao as KvRadio,
-  Qo as KvSecondaryNav,
-  lo as KvSelect,
-  mo as KvSideSheet,
-  uo as KvSwitch,
-  no as KvTab,
-  vo as KvTabPanel,
-  io as KvTabs,
-  _o as KvTextInput,
-  No as KvTextLink,
-  co as KvThemeProvider,
-  Ro as KvToast,
-  Oo as KvTooltip,
-  Io as KvTreeMapChart,
-  go as KvUserAvatar,
-  ho as KvUtilityMenu,
-  Vo as KvVerticalCarousel,
-  Do as KvVotingCard,
-  yo as KvVotingCardV2,
-  Wo as KvWideLoanCard,
-  Jo as KvWwwHeader,
-  pt as LOAN_CALLOUTS_FRAGMENT,
-  ut as LOAN_GEOCODE_FRAGMENT,
-  xt as LOAN_PROGRESS_FRAGMENT,
-  Zo as Mash,
-  _t as NO_BALANCE_CAMPAIGN,
-  Lt as TOP_UP_CAMPAIGN,
-  Mt as animationCoordinator,
-  bt as buildTailwindClassName,
-  tt as carouselUtil,
-  at as collapse,
-  ft as expand,
-  Ot as generateMapMarkers,
-  St as getCoordinatesBetween,
-  It as getCountryColor,
-  Nt as getDropdownPriceArray,
-  Tt as getLendCtaSelectedOption,
-  Pt as getLoansIntervals,
-  Yt as getTreemap,
-  Ut as headerNumberCase,
-  ct as isBetween25And50,
-  st as isLegacyPlaceholderAvatar,
-  Et as isLessThan25,
-  Qt as isTargetElement,
-  wt as kebabCase,
-  nt as loanCardComputedProperties,
-  Kt as loanCardMethods,
-  Gt as lockPrintSingleEl,
-  Vt as lockScroll,
-  Bt as lockScrollSmallOnly,
-  qt as offBodyTouchstart,
-  Jt as onBodyTouchstart,
-  dt as randomizedUserAvatarClass,
-  Wt as removeObjectProperty,
-  jt as throttle,
-  ht as unlockPrintSingleEl,
-  Dt as unlockScroll,
-  kt as unlockScrollSmallOnly,
-  et as useAttrs
+  ee as KvImpactVerticalSelector,
+  te as KvInlineActivityCard,
+  ae as KvInlineActivityFeed,
+  de as KvIntroductionLoanCard,
+  pe as KvLendAmountButton,
+  Ke as KvLendCta,
+  Ae as KvLightbox,
+  Ce as KvLineGraph,
+  ke as KvLoadingPlaceholder,
+  be as KvLoadingSpinner,
+  Ne as KvLoanActivities,
+  Ee as KvLoanBookmark,
+  Me as KvLoanCallouts,
+  Se as KvLoanProgressGroup,
+  ge as KvLoanTag,
+  he as KvLoanTeamPick,
+  Be as KvLoanUse,
+  we as KvMap,
+  He as KvMaterialIcon,
+  ze as KvPageContainer,
+  qe as KvPagination,
+  Xe as KvPieChart,
+  Ze as KvPill,
+  eo as KvPopper,
+  to as KvProgressBar,
+  ao as KvPulsingDot,
+  lo as KvRadio,
+  Jo as KvSecondaryNav,
+  mo as KvSelect,
+  uo as KvSideSheet,
+  no as KvSwitch,
+  vo as KvTab,
+  io as KvTabPanel,
+  _o as KvTabs,
+  No as KvTextInput,
+  co as KvTextLink,
+  Ro as KvThemeProvider,
+  Oo as KvToast,
+  Io as KvTooltip,
+  go as KvTreeMapChart,
+  ho as KvUserAvatar,
+  Vo as KvUtilityMenu,
+  Do as KvVerticalCarousel,
+  yo as KvVotingCard,
+  Uo as KvVotingCardV2,
+  jo as KvWideLoanCard,
+  Yo as KvWwwHeader,
+  xt as LOAN_CALLOUTS_FRAGMENT,
+  nt as LOAN_GEOCODE_FRAGMENT,
+  Kt as LOAN_PROGRESS_FRAGMENT,
+  et as Mash,
+  Nt as NO_BALANCE_CAMPAIGN,
+  Tt as TOP_UP_CAMPAIGN,
+  St as animationCoordinator,
+  wt as buildTailwindClassName,
+  at as carouselUtil,
+  lt as collapse,
+  st as expand,
+  It as generateMapMarkers,
+  Pt as getCoordinatesBetween,
+  gt as getCountryColor,
+  ct as getDropdownPriceArray,
+  Et as getLendCtaSelectedOption,
+  Gt as getLoansIntervals,
+  $t as getTreemap,
+  Wt as headerNumberCase,
+  Rt as isBetween25And50,
+  mt as isLegacyPlaceholderAvatar,
+  Mt as isLessThan25,
+  Jt as isTargetElement,
+  Ht as kebabCase,
+  vt as loanCardComputedProperties,
+  At as loanCardMethods,
+  Ft as lockPrintSingleEl,
+  Dt as lockScroll,
+  kt as lockScrollSmallOnly,
+  Xt as offBodyTouchstart,
+  Yt as onBodyTouchstart,
+  pt as randomizedUserAvatarClass,
+  jt as removeObjectProperty,
+  Qt as throttle,
+  Vt as unlockPrintSingleEl,
+  yt as unlockScroll,
+  bt as unlockScrollSmallOnly,
+  tt as useAttrs
 };

package/dist/vue/KvCardFrame.js

@@ -1,5 +1,5 @@
-import { computed as l, resolveComponent as n, openBlock as d, createBlock as m, withCtx as i, createElementVNode as h, normalizeClass as u, renderSlot as c } from "vue";
-import { defaultTheme as r, stoneDarkTheme as f, stoneLightTheme as g, marigoldLightTheme as p, greenLightTheme as v, greenDarkTheme as w } from "@kiva/kv-tokens";
+import { computed as n, resolveComponent as d, openBlock as i, createBlock as m, normalizeClass as r, withCtx as h, createElementVNode as u, renderSlot as c } from "vue";
+import { defaultTheme as a, stoneDarkTheme as f, stoneLightTheme as g, marigoldLightTheme as v, greenLightTheme as p, greenDarkTheme as w } from "@kiva/kv-tokens";
 import C from "./KvThemeProvider.js";
 import k from "../_virtual/_plugin-vue_export-helper.js";
 const _ = {
@@ -30,7 +30,7 @@ const _ = {
     theme: {
       type: String,
       default: "default",
-      validator(e) {
+      validator(t) {
         return [
           "default",
           "greenLight",
@@ -38,53 +38,53 @@ const _ = {
           "marigoldLight",
           "stoneLight",
           "stoneDark"
-        ].includes(e);
+        ].includes(t);
       }
     }
   },
-  setup(e) {
-    return { themeStyle: l(() => {
-      switch (e.theme) {
+  setup(t) {
+    return { themeStyle: n(() => {
+      switch (t.theme) {
         case "default":
-          return r;
+          return a;
         case "greenDark":
           return w;
         case "greenLight":
-          return v;
-        case "marigoldLight":
           return p;
+        case "marigoldLight":
+          return v;
         case "stoneLight":
           return g;
         case "stoneDark":
           return f;
         default:
-          return r;
+          return a;
       }
     }) };
   }
 };
-function y(e, a, t, o, L, S) {
-  const s = n("kv-theme-provider");
-  return d(), m(s, {
-    theme: o.themeStyle,
-    class: "kv-card-frame-theme-provider"
+function y(t, o, e, s, L, S) {
+  const l = d("kv-theme-provider");
+  return i(), m(l, {
+    theme: s.themeStyle,
+    class: r(["kv-card-frame-theme-provider", e.radiusClass])
   }, {
-    default: i(() => [
-      h("div", {
-        class: u([
-          "kv-card-frame",
-          t.bgColorClass,
-          t.radiusClass,
-          t.shadowClass,
-          t.borderClass,
-          { "tw-overflow-hidden": !t.allowOverflow }
+    default: h(() => [
+      u("div", {
+        class: r([
+          "kv-card-frame tw-h-full",
+          e.bgColorClass,
+          e.radiusClass,
+          e.shadowClass,
+          e.borderClass,
+          { "tw-overflow-hidden": !e.allowOverflow }
         ])
       }, [
-        c(e.$slots, "default")
+        c(t.$slots, "default")
       ], 2)
     ]),
     _: 3
-  }, 8, ["theme"]);
+  }, 8, ["theme", "class"]);
 }
 const B = /* @__PURE__ */ k(_, [["render", y]]);
 export {

package/dist/vue/KvImpactVerticalSelector.js

@@ -0,0 +1,109 @@
+import { ref as E, onMounted as N, computed as y, resolveComponent as x, openBlock as r, createElementBlock as d, createElementVNode as o, Fragment as B, renderList as K, createBlock as I, withCtx as V, createCommentVNode as L, toDisplayString as S } from "vue";
+import W from "./KvCardFrame.js";
+import A from "./KvContentfulImg.js";
+import D from "../_virtual/_plugin-vue_export-helper.js";
+const F = {
+  components: {
+    KvCardFrame: W,
+    KvContentfulImg: A
+  },
+  props: {
+    // Expects an array of categories from our API
+    categoryList: {
+      type: Array,
+      default: () => []
+    },
+    // Expects a list of category ids to hide from the selector
+    hiddenCategories: {
+      type: Array,
+      default: () => []
+    },
+    imageWidth: {
+      type: Number,
+      default: 64
+    },
+    // Category id to pre-select when component mounts
+    preSelectedCategory: {
+      type: String,
+      default: null
+    }
+  },
+  emits: ["category-selected"],
+  setup(l, { emit: u }) {
+    const s = E(null), n = (e) => {
+      s.value = e, u("category-selected", e);
+    };
+    N(() => {
+      l.preSelectedCategory && n(l.preSelectedCategory);
+    });
+    const f = (e) => {
+      var i, t, c, _, h, g, C, p, k;
+      if (e.contentfulEntry) {
+        const a = (_ = (c = (t = (i = e == null ? void 0 : e.contentfulEntry) == null ? void 0 : i.entry) == null ? void 0 : t.fields) == null ? void 0 : c.content) == null ? void 0 : _.find(
+          (m) => {
+            var v, b;
+            return (b = (v = m == null ? void 0 : m.fields) == null ? void 0 : v.key) == null ? void 0 : b.includes("category-icon");
+          }
+        );
+        return ((k = (p = (C = (g = (h = a == null ? void 0 : a.fields) == null ? void 0 : h.contentLight) == null ? void 0 : g[0]) == null ? void 0 : C.fields) == null ? void 0 : p.file) == null ? void 0 : k.url) ?? null;
+      }
+      return null;
+    }, w = y(() => !l.categoryList || l.categoryList.length === 0 ? [] : l.categoryList.filter((e) => !l.hiddenCategories.includes(e.id)).map((e) => ({
+      id: e.id,
+      name: e.name,
+      description: e.description,
+      customImage: e.customImage || null,
+      contentfulImage: f(e) || null
+    })));
+    return {
+      selectedCategory: s,
+      formattedCategories: w,
+      selectCategory: n
+    };
+  }
+}, M = { class: "tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3" }, j = { class: "tw-p-2 tw-flex tw-flex-row md:tw-flex-col tw-items-center tw-cursor-pointer" }, q = ["alt", "src", "width"], z = { class: "md:tw-text-center" }, G = { class: "tw-mb-0.5 tw-font-medium" }, H = { class: "tw-text-small" }, J = {
+  key: 0,
+  class: "tw-text-gray-500 tw-italic"
+};
+function O(l, u, s, n, f, w) {
+  const e = x("kv-contentful-img"), i = x("kv-card-frame");
+  return r(), d("div", null, [
+    o("div", M, [
+      (r(!0), d(B, null, K(n.formattedCategories, (t) => (r(), I(i, {
+        key: t.id,
+        "bg-color-class": n.selectedCategory === t.id ? "tw-bg-secondary" : "tw-bg-white",
+        "border-class": n.selectedCategory === t.id ? "tw-border-2 tw-border-action" : "tw-border-2 tw-border-transparent",
+        class: "tw-transition-all tw-duration-200 hover:tw-shadow-lg",
+        onClick: (c) => n.selectCategory(t.id)
+      }, {
+        default: V(() => [
+          o("div", j, [
+            t != null && t.contentfulImage ? (r(), I(e, {
+              key: 0,
+              class: "tw-shrink-0 tw-mr-2 md:tw-mr-0 md:tw-mb-2",
+              alt: `${t.name} image`,
+              "contentful-src": t.contentfulImage,
+              width: s.imageWidth
+            }, null, 8, ["alt", "contentful-src", "width"])) : t != null && t.customImage ? (r(), d("img", {
+              key: 1,
+              class: "tw-shrink-0 tw-mr-2 md:tw-mr-0 md:tw-mb-2",
+              alt: `${t.name} image`,
+              src: t.customImage,
+              width: s.imageWidth
+            }, null, 8, q)) : L("", !0),
+            o("div", z, [
+              o("p", G, S(t.name), 1),
+              o("p", H, S(t.description), 1)
+            ])
+          ])
+        ]),
+        _: 2
+      }, 1032, ["bg-color-class", "border-class", "onClick"]))), 128))
+    ]),
+    n.formattedCategories.length === 0 ? (r(), d("p", J, " No categories available ")) : L("", !0)
+  ]);
+}
+const U = /* @__PURE__ */ D(F, [["render", O]]);
+export {
+  U as default
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "6.45.1",
+  "version": "6.46.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -21,7 +21,7 @@
     "@babel/preset-env": "^7.24.8",
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
-    "@kiva/kv-tokens": "^3.3.0",
+    "@kiva/kv-tokens": "^3.4.0",
     "@kiva/vite-plugin-vue-lib-css": "^2.0.0",
     "@laynezh/vite-plugin-lib-assets": "^0.6.1",
     "@mdi/js": "^7.4.47",
@@ -114,5 +114,5 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "e97c79e6839a539964040da8580902d2ef78c43b"
+  "gitHead": "10e63d7a940721ead5070aff7d1b4f6fb45aa58d"
 }