@kiva/kv-components 8.14.1 → 8.15.0

package/dist/vue/KvWwwHeaderBasic/MyKivaMenu2.js

@@ -0,0 +1,45 @@
+import { inject as a } from "vue";
+import l from "../KvWwwHeader/KvHeaderMenuLink.js";
+const u = {
+  name: "MyKivaMenu",
+  components: { KvHeaderMenuLink: l },
+  props: {
+    // Accepts the orchestrator's user props; loggedIn/userId are part of the shared menu contract.
+    loggedIn: {
+      type: Boolean,
+      default: !1
+    },
+    userId: {
+      type: Number,
+      default: null
+    },
+    isBorrower: {
+      type: Boolean,
+      default: !1
+    },
+    isTrustee: {
+      type: Boolean,
+      default: !1
+    },
+    myDashboardUrl: {
+      type: String,
+      default: "/mykiva"
+    },
+    isMobile: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["closing-menu"],
+  setup(r, { emit: e }) {
+    const o = a("$kvTrackEvent", () => {
+    });
+    function n(t) {
+      o("TopNav", t), e("closing-menu");
+    }
+    return { onLinkClick: n };
+  }
+};
+export {
+  u as default
+};

package/dist/vue/KvWwwHeaderBasic/SearchBar.js

@@ -0,0 +1,73 @@
+import b from "./SearchBar2.js";
+import { resolveComponent as f, openBlock as r, createElementBlock as n, withModifiers as l, createElementVNode as o, createVNode as v, withKeys as d, withDirectives as y, normalizeClass as u, Fragment as w, renderList as c, toDisplayString as _, vShow as S } from "vue";
+import x from "../../_virtual/_plugin-vue_export-helper.js";
+const g = ["for"], k = ["data-testid"], B = { class: "tw-text-base tw-py-0.5" }, M = ["data-testid", "onClick"], I = ["innerHTML"];
+function C(F, a, m, t, D, K) {
+  const p = f("kv-text-input");
+  return r(), n("form", {
+    class: "tw-relative",
+    autocomplete: "off",
+    onSubmit: a[1] || (a[1] = l((...e) => t.onSubmit && t.onSubmit(...e), ["prevent"]))
+  }, [
+    o("label", {
+      for: t.inputId,
+      class: "tw-sr-only"
+    }, "Search all loans", 8, g),
+    v(p, {
+      id: t.inputId,
+      type: "search",
+      name: "queryString",
+      "data-testid": "header-basic-search-input",
+      icon: t.mdiMagnify,
+      "model-value": t.displayTerm,
+      "can-clear": !0,
+      class: "tw-w-full",
+      placeholder: "Search all loans",
+      onInput: t.onInput,
+      onFocus: t.onFocus,
+      onBlur: t.onBlur,
+      onKeydown: [
+        d(l(t.listUp, ["prevent"]), ["up"]),
+        d(l(t.listDown, ["prevent"]), ["down"]),
+        d(l(t.onSubmit, ["prevent"]), ["enter"])
+      ]
+    }, null, 8, ["id", "icon", "model-value", "onInput", "onFocus", "onBlur", "onKeydown"]),
+    y(o("ol", {
+      class: u(["tw-w-full tw-bg-primary tw-p-2.5 tw-border tw-border-tertiary tw-overflow-auto", m.isMobile ? "tw-mt-2" : "tw-absolute tw-z-popover tw-inset-x-0 md:tw-rounded-b"])
+    }, [
+      (r(!0), n(w, null, c(t.groupedResults, (e) => (r(), n("li", {
+        key: e.group,
+        "data-testid": `header-basic-search-results-${e.group}`
+      }, [
+        o("h2", B, _(e.group), 1),
+        o("ol", null, [
+          (r(!0), n(w, null, c(e.items, (i, h) => {
+            var s;
+            return r(), n("li", {
+              key: i.label
+            }, [
+              o("button", {
+                type: "button",
+                class: u(["tw-w-full tw-text-left tw-pl-1.5 tw-py-0.5 tw-rounded-xs tw-font-medium tw-cursor-pointer hover:tw-bg-secondary hover:tw-underline", { "tw-bg-secondary tw-underline": i.label === ((s = t.highlighted) == null ? void 0 : s.label) }]),
+                "data-testid": `header-basic-search-result-item-${e.group}-${h}`,
+                onMousedown: a[0] || (a[0] = l(() => {
+                }, ["prevent"])),
+                onClick: (L) => t.runSearch(i)
+              }, [
+                o("span", {
+                  innerHTML: t.formatResult(i)
+                }, null, 8, I)
+              ], 42, M)
+            ]);
+          }), 128))
+        ])
+      ], 8, k))), 128))
+    ], 2), [
+      [S, t.showResults]
+    ])
+  ], 32);
+}
+const E = /* @__PURE__ */ x(b, [["render", C]]);
+export {
+  E as default
+};

package/dist/vue/KvWwwHeaderBasic/SearchBar.vue.d.ts

@@ -0,0 +1,54 @@
+import { SearchSuggestion } from '../../../../../../../../../../src/utils/typeaheadSearchEngine';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    searchSuggestions: {
+        type: () => SearchSuggestion[];
+        default: () => any[];
+    };
+    appOrigin: {
+        type: StringConstructor;
+        default: string;
+    };
+    isMobile: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    mdiMagnify: string;
+    inputId: string;
+    term: any;
+    displayTerm: import('vue').ComputedRef<any>;
+    groupedResults: any;
+    highlighted: import('vue').ComputedRef<any>;
+    showResults: import('vue').ComputedRef<boolean>;
+    onInput: (value: string) => void;
+    onFocus: () => void;
+    onBlur: () => void;
+    onSubmit: () => void;
+    runSearch: (suggestion: SearchSuggestion) => void;
+    listUp: () => void;
+    listDown: () => void;
+    formatResult: (suggestion: SearchSuggestion) => string;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("load-search-data" | "search-submit")[], "load-search-data" | "search-submit", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    searchSuggestions: {
+        type: () => SearchSuggestion[];
+        default: () => any[];
+    };
+    appOrigin: {
+        type: StringConstructor;
+        default: string;
+    };
+    isMobile: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    "onLoad-search-data"?: (...args: any[]) => any;
+    "onSearch-submit"?: (...args: any[]) => any;
+}>, {
+    isMobile: boolean;
+    searchSuggestions: SearchSuggestion[];
+    appOrigin: string;
+}, {}, {
+    KvTextInput: any;
+}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/vue/KvWwwHeaderBasic/SearchBar2.js

@@ -0,0 +1,84 @@
+import { inject as x, ref as m, toRef as B, computed as s } from "vue";
+import { mdiMagnify as E } from "@mdi/js";
+import F from "../KvTextInput.js";
+import O from "../../utils/markMatches.js";
+import { useTypeaheadSearch as _ } from "../../utils/useTypeaheadSearch.js";
+const K = {
+  name: "SearchBar",
+  components: { KvTextInput: F },
+  props: {
+    searchSuggestions: {
+      type: Array,
+      default: () => []
+    },
+    appOrigin: {
+      type: String,
+      default: ""
+    },
+    isMobile: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["load-search-data", "search-submit"],
+  setup(r, { emit: i }) {
+    const f = x("$kvTrackEvent", () => {
+    }), p = "kv-www-header-basic-search", n = m(!1), v = m(!1), {
+      term: t,
+      groupedResults: l,
+      activeIndex: a,
+      resolveSubmit: d
+    } = _(B(r, "searchSuggestions"), r.appOrigin), o = s(() => l.value.flatMap((e) => e.items)), u = s(() => a.value > -1 ? o.value[a.value] : void 0), g = s(() => {
+      var e;
+      return ((e = u.value) == null ? void 0 : e.label) ?? t.value;
+    }), b = s(() => l.value.length > 0 && n.value);
+    function y(e) {
+      t.value = e;
+    }
+    function S() {
+      n.value = !0, v.value || (i("load-search-data"), v.value = !0), f("search", "focus");
+    }
+    function k() {
+      n.value = !1, a.value = -1;
+    }
+    function c(e) {
+      const h = d(e);
+      f("search", "click", h.suggestion ? "type-ahead-search" : "custom-search-option"), i("search-submit", h);
+    }
+    function w(e) {
+      c(e);
+    }
+    function I() {
+      u.value ? c(u.value) : c(t.value);
+    }
+    function R() {
+      a.value += 1, a.value >= o.value.length && (a.value = -1);
+    }
+    function T() {
+      a.value === -1 && (a.value = o.value.length), a.value -= 1;
+    }
+    function M(e) {
+      return O(e.label, e.matches);
+    }
+    return {
+      mdiMagnify: E,
+      inputId: p,
+      term: t,
+      displayTerm: g,
+      groupedResults: l,
+      highlighted: u,
+      showResults: b,
+      onInput: y,
+      onFocus: S,
+      onBlur: k,
+      onSubmit: I,
+      runSearch: w,
+      listUp: T,
+      listDown: R,
+      formatResult: M
+    };
+  }
+};
+export {
+  K as default
+};

package/dist/vue/index.d.ts

@@ -89,3 +89,4 @@ export * from './KvWideLoanCard.vue';
 export { default as KvAtbModal } from './KvAtbModal.vue';
 export { default as KvSecondaryNav } from './KvSecondaryNav.vue';
 export { default as KvWwwHeader } from './KvWwwHeader.vue';
+export { default as KvWwwHeaderBasic } from './KvWwwHeaderBasic/KvWwwHeaderBasic.vue';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "8.14.1",
+  "version": "8.15.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -34,7 +34,7 @@
     "@babel/preset-env": "^7.24.8",
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
-    "@kiva/kv-tokens": "^4.0.3",
+    "@kiva/kv-tokens": "^4.1.0",
     "@kiva/vite-plugin-vue-lib-css": "^2.0.0",
     "@laynezh/vite-plugin-lib-assets": "^0.6.1",
     "@mdi/js": "^7.4.47",
@@ -125,5 +125,8 @@
     "embla-carousel-fade",
     "popper.js"
   ],
-  "gitHead": "d0fa7bf1f6f09507d97ff5e7713842e346607cc0"
+  "dependencies": {
+    "fuse.js": "^7.1.0"
+  },
+  "gitHead": "d615c83ca4ae49487e28a78a5c8f2b060633299a"
 }