@leaflink/stash 51.11.0 → 51.12.0

package/dist/PageHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageHeader.js","sources":["../src/components/PageHeader/PageHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, useCssModule, useSlots } from 'vue';\n\n  export interface PageHeaderProps {\n    /**\n     * The title of the page.\n     */\n    title?: string;\n    /**\n     * The description of the page.\n     */\n    description?: string;\n  }\n\n  defineOptions({\n    name: 'll-page-header',\n  });\n\n  const props = withDefaults(defineProps<PageHeaderProps>(), {\n    title: undefined,\n    description: undefined,\n  });\n\n  const classes = useCssModule();\n  const slots = useSlots();\n\n  const hasActions = computed<boolean>(() => !!(slots['primary-action'] || slots['secondary-action']));\n</script>\n\n<template>\n  <header\n    class=\"stash-page-header\"\n    :class=\"[classes.root, { [classes.grid]: hasActions }]\"\n    data-test=\"stash-page-header\"\n  >\n    <div class=\"tw-col-span-full tw-flex tw-items-center lg:tw-col-span-1\">\n      <div v-if=\"slots.media\" class=\"stash-page-header__media tw-mr-3 tw-self-center\" :class=\"classes.mediaTest\">\n        <!-- @slot Receives a custom media -->\n        <slot name=\"media\"></slot>\n      </div>\n\n      <div>\n        <!-- @slot Receives a custom title -->\n        <slot name=\"title\">\n          <h1 v-if=\"props.title\" class=\"stash-page-header__title tw-my-0\">{{ props.title }}</h1>\n        </slot>\n\n        <!-- @slot Receives a custom description -->\n        <slot name=\"description\">\n          <p v-if=\"props.description\" class=\"stash-page-header__description tw-mb-0 tw-mt-1.5\">\n            {{ props.description }}\n          </p>\n        </slot>\n      </div>\n    </div>\n\n    <div\n      v-if=\"hasActions\"\n      class=\"stash-page-header__actions tw-col-span-full tw-flex lg:tw-col-span-1\"\n      :class=\"classes.actions\"\n    >\n      <!-- @slot Receives a custom secondary action -->\n      <slot name=\"secondary-action\"> </slot>\n      <!-- @slot Receives a custom primary action -->\n      <slot name=\"primary-action\"> </slot>\n    </div>\n  </header>\n</template>\n\n<style module>\n  .root {\n    border-bottom: 0;\n    display: grid;\n    gap: var(--grid-gutter);\n    margin: 0 auto;\n    max-width: theme('width.container');\n    padding: theme('spacing.6') var(--grid-gutter) theme('spacing.12');\n    width: 100%;\n  }\n\n  @media screen('lg') {\n    .root.grid {\n      grid-template-columns: repeat(2, 1fr);\n    }\n  }\n\n  .actions {\n    align-self: flex-end;\n    flex-direction: column-reverse;\n    row-gap: var(--grid-gutter);\n  }\n\n  @media screen('md') {\n    .actions {\n      column-gap: var(--grid-gutter);\n      flex-direction: row;\n      row-gap: 0;\n    }\n  }\n\n  @media screen('lg') {\n    .actions {\n      align-items: flex-end;\n      flex-direction: row;\n      justify-content: flex-end;\n    }\n  }\n\n  /* max size for media/marketing illustration icons we would be passing to the slot */\n  .media-test {\n    max-width: 58px;\n    max-height: 58px;\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule","slots","useSlots","hasActions","computed","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_hoisted_1","_renderSlot","_ctx","_openBlock","_hoisted_2","_toDisplayString","_hoisted_3"],"mappings":";;;;;;;;;;;;;;;;AAkBE,UAAMA,IAAQC,GAKRC,IAAUC,EAAA,GACVC,IAAQC,EAAA,GAERC,IAAaC,EAAkB,MAAM,CAAC,EAAEH,EAAM,gBAAgB,KAAKA,EAAM,kBAAkB,EAAE;2BAInGI,EAoCS,UAAA;AAAA,MAnCP,OAAKC,EAAA,CAAC,qBAAmB,CAChBC,EAAAR,CAAA,EAAQ,MAAI,EAAA,CAAKQ,EAAAR,CAAA,EAAQ,IAAI,GAAGI,EAAA,MAAA,CAAU,CAAA,CAAA;AAAA,MACnD,aAAU;AAAA,IAAA;MAEVK,EAmBM,OAnBNC,GAmBM;AAAA,QAlBOF,EAAAN,CAAA,EAAM,cAAjBI,EAGM,OAAA;AAAA;UAHkB,OAAKC,EAAA,CAAC,mDAA0DC,EAAAR,CAAA,EAAQ,SAAS,CAAA;AAAA,QAAA;UAEvGW,EAA0BC,EAAA,QAAA,OAAA;AAAA,QAAA;QAG5BH,EAYM,OAAA,MAAA;AAAA,UAVJE,EAEOC,uBAFP,MAEO;AAAA,YADKd,EAAM,SAAhBe,EAAA,GAAAP,EAAsF,MAAtFQ,GAAsFC,EAAnBjB,EAAM,KAAK,GAAA,CAAA;;UAIhFa,EAIOC,6BAJP,MAIO;AAAA,YAHId,EAAM,eAAfe,EAAA,GAAAP,EAEI,KAFJU,GAEID,EADCjB,EAAM,WAAW,GAAA,CAAA;;;;MAOpBM,EAAA,cADRE,EASM,OAAA;AAAA;QAPJ,OAAKC,EAAA,CAAC,wEACEC,EAAAR,CAAA,EAAQ,OAAO,CAAA;AAAA,MAAA;QAGvBW,EAAsCC,EAAA,QAAA,kBAAA;AAAA,QAEtCD,EAAoCC,EAAA,QAAA,gBAAA;AAAA,MAAA;;;;;;;;;;;"}
+{"version":3,"file":"PageHeader.js","sources":["../src/components/PageHeader/PageHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, useCssModule, useSlots } from 'vue';\n\n  export interface PageHeaderProps {\n    /**\n     * The title of the page.\n     */\n    title?: string;\n    /**\n     * The description of the page.\n     */\n    description?: string;\n  }\n\n  defineOptions({\n    name: 'll-page-header',\n  });\n\n  const props = withDefaults(defineProps<PageHeaderProps>(), {\n    title: undefined,\n    description: undefined,\n  });\n\n  const classes = useCssModule();\n  const slots = useSlots();\n\n  const hasActions = computed<boolean>(() => !!(slots['primary-action'] || slots['secondary-action']));\n</script>\n\n<template>\n  <header\n    class=\"stash-page-header\"\n    :class=\"[classes.root, { [classes.grid]: hasActions }]\"\n    data-test=\"stash-page-header\"\n  >\n    <div class=\"tw-col-span-full tw-flex tw-items-center lg:tw-col-span-1\">\n      <div v-if=\"slots.media\" class=\"stash-page-header__media tw-mr-3 tw-self-center\" :class=\"classes.mediaTest\">\n        <!-- @slot Receives a custom media -->\n        <slot name=\"media\"></slot>\n      </div>\n\n      <div>\n        <!-- @slot Receives a custom title -->\n        <slot name=\"title\">\n          <h1 v-if=\"props.title\" class=\"stash-page-header__title tw-my-0\">{{ props.title }}</h1>\n        </slot>\n\n        <!-- @slot Receives a custom description -->\n        <slot name=\"description\">\n          <p v-if=\"props.description\" class=\"stash-page-header__description tw-mb-0 tw-mt-1.5\">\n            {{ props.description }}\n          </p>\n        </slot>\n      </div>\n    </div>\n\n    <div\n      v-if=\"hasActions\"\n      class=\"stash-page-header__actions tw-col-span-full tw-flex lg:tw-col-span-1\"\n      :class=\"classes.actions\"\n    >\n      <!-- @slot Receives a custom secondary action -->\n      <slot name=\"secondary-action\"> </slot>\n      <!-- @slot Receives a custom primary action -->\n      <slot name=\"primary-action\"> </slot>\n    </div>\n  </header>\n</template>\n\n<style module>\n  .root {\n    border-bottom: 0;\n    display: grid;\n    gap: var(--grid-gutter);\n    margin: 0 auto;\n    max-width: theme('width.container');\n    padding: theme('spacing.6') var(--grid-gutter) theme('spacing.12');\n    width: 100%;\n  }\n\n  @media screen('lg') {\n    .root.grid {\n      grid-template-columns: repeat(2, 1fr);\n    }\n  }\n\n  .actions {\n    align-self: flex-end;\n    flex-direction: column-reverse;\n    row-gap: var(--grid-gutter);\n  }\n\n  @media screen('md') {\n    .actions {\n      column-gap: var(--grid-gutter);\n      flex-direction: row;\n      row-gap: 0;\n    }\n  }\n\n  @media screen('lg') {\n    .actions {\n      align-items: flex-end;\n      flex-direction: row;\n      justify-content: flex-end;\n    }\n  }\n\n  /* max size for media/marketing illustration icons we would be passing to the slot */\n  .media-test {\n    max-width: 58px;\n    max-height: 58px;\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule","slots","useSlots","hasActions","computed"],"mappings":";;;;;;;;;;;;;;;;AAkBE,UAAMA,IAAQC,GAKRC,IAAUC,EAAA,GACVC,IAAQC,EAAA,GAERC,IAAaC,EAAkB,MAAM,CAAC,EAAEH,EAAM,gBAAgB,KAAKA,EAAM,kBAAkB,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/PageHeader.vue.d.ts

@@ -1,27 +1,56 @@
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
+import { PropType } from 'vue';
 import { PublicProps } from 'vue';
 
+declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+
+declare type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+
+declare type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
+declare type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
 
-declare const _default: __VLS_WithTemplateSlots<DefineComponent<PageHeaderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PageHeaderProps> & Readonly<{}>, {
-description: string;
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PageHeaderProps>, {
+title: undefined;
+description: undefined;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PageHeaderProps>, {
+title: undefined;
+description: undefined;
+}>>> & Readonly<{}>, {
 title: string;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>, {
+description: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     media?(_: {}): any;
     title?(_: {}): any;
     description?(_: {}): any;
-    'secondary-action'?(_: {}): any;
-    'primary-action'?(_: {}): any;
+    "secondary-action"?(_: {}): any;
+    "primary-action"?(_: {}): any;
 }>;
 export default _default;
 
-declare interface PageHeaderProps {
+export declare interface PageHeaderProps {
     /**
      * The title of the page.
      */

package/dist/PageNavigation.js

@@ -1,13 +1,13 @@
-import { defineComponent as b, ref as g, watch as x, onMounted as I, createElementBlock as f, openBlock as s, createVNode as _, withCtx as p, Fragment as T, renderList as V, createBlock as k, unref as N, createTextVNode as B, toDisplayString as C } from "vue";
-import R from "@leaflink/snitch";
-import d from "lodash-es/kebabCase";
-import { useRoute as U, useRouter as y } from "vue-router";
-import M from "./Tab.js";
-import P from "./Tabs.js";
-const D = {
+import { defineComponent as g, ref as x, watch as I, onMounted as _, createElementBlock as i, openBlock as u, createVNode as T, withCtx as p, Fragment as V, renderList as k, createBlock as N, unref as B, createTextVNode as C, toDisplayString as U } from "vue";
+import y from "@leaflink/snitch";
+import s from "lodash-es/kebabCase";
+import { useRoute as P, useRouter as D } from "vue-router";
+import E from "./Tab.js";
+import F from "./Tabs.js";
+const L = {
   class: "stash-page-navigation container",
   "data-test": "stash-page-navigation"
-}, q = /* @__PURE__ */ b({
+}, z = /* @__PURE__ */ g({
   name: "ll-page-navigation",
   __name: "PageNavigation",
   props: {
@@ -16,59 +16,59 @@ const D = {
     items: {}
   },
   emits: ["update:modelValue", "change"],
-  setup(v, { emit: m }) {
-    const a = v, u = m;
-    a.activeIndex && R.info("The `activeIndex` prop is deprecated. Use `v-model` instead.");
-    const o = U(), c = y(), l = g("");
-    function r(t) {
-      t !== l.value && (l.value = t, u("update:modelValue", t));
+  setup(v, { emit: h }) {
+    const n = v, c = h;
+    n.activeIndex && y.info("The `activeIndex` prop is deprecated. Use `v-model` instead.");
+    const r = P(), f = D(), d = x("");
+    function o(t) {
+      t !== d.value && (d.value = t, c("update:modelValue", t));
     }
-    return x(
-      () => a.modelValue,
-      (t, n) => {
-        if (n === t) return;
-        const e = a.items.findIndex((i) => d(i.label) === t);
-        u("change", e), r(t);
+    return I(
+      () => n.modelValue,
+      (t, e) => {
+        if (e === t) return;
+        const a = n.items.findIndex((l) => s(l.label) === t);
+        c("change", a), o(t);
       }
-    ), I(() => {
-      if (!a.items.length) return;
-      if (a.activeIndex !== void 0) {
-        const n = a.items[a.activeIndex];
-        r(d(n.label));
+    ), _(() => {
+      if (!n.items.length) return;
+      if (n.activeIndex !== void 0) {
+        const e = n.items[n.activeIndex];
+        o(s(e.label));
         return;
       }
-      if (a.modelValue !== l.value) {
-        r(a.modelValue);
+      if (n.modelValue !== d.value) {
+        o(n.modelValue);
         return;
       }
-      if (!c) return;
-      const t = a.items.find((n) => {
-        if (n?.disabled || !n?.to && !n?.href) return;
-        const { path: e } = c.resolve(n?.to || n?.href);
-        if (e === o.path)
+      if (!f) return;
+      const t = n.items.find((e) => {
+        if (e != null && e.disabled || !(e != null && e.to) && !(e != null && e.href)) return;
+        const { path: a } = f.resolve((e == null ? void 0 : e.to) || (e == null ? void 0 : e.href));
+        if (a === r.path)
           return !0;
-        if (!o.path.includes(e)) return;
-        const i = (o.path.length - o.path.lastIndexOf("/")) * -1, h = o.path.slice(0, i);
-        return e === h;
+        if (!r.path.includes(a)) return;
+        const l = (r.path.length - r.path.lastIndexOf("/")) * -1, b = r.path.slice(0, l);
+        return a === b;
       });
-      t && r(t?.value || d(t.label));
-    }), (t, n) => (s(), f("nav", D, [
-      _(P, {
-        "active-tab": l.value,
-        "onUpdate:activeTab": r
+      t && o((t == null ? void 0 : t.value) || s(t.label));
+    }), (t, e) => (u(), i("nav", L, [
+      T(F, {
+        "active-tab": d.value,
+        "onUpdate:activeTab": o
       }, {
         default: p(() => [
-          (s(!0), f(T, null, V(a.items, (e, i) => (s(), k(M, {
-            key: e.label,
-            value: e?.value || N(d)(e.label),
-            to: e.to,
-            href: e.href,
-            badge: e.badge,
-            disabled: e.disabled,
-            "data-id": i
+          (u(!0), i(V, null, k(n.items, (a, l) => (u(), N(E, {
+            key: a.label,
+            value: (a == null ? void 0 : a.value) || B(s)(a.label),
+            to: a.to,
+            href: a.href,
+            badge: a.badge,
+            disabled: a.disabled,
+            "data-id": l
           }, {
             default: p(() => [
-              B(C(e.label), 1)
+              C(U(a.label), 1)
             ]),
             _: 2
           }, 1032, ["value", "to", "href", "badge", "disabled", "data-id"]))), 128))
@@ -79,6 +79,6 @@ const D = {
   }
 });
 export {
-  q as default
+  z as default
 };
 //# sourceMappingURL=PageNavigation.js.map

package/dist/PageNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageNavigation.js","sources":["../src/components/PageNavigation/PageNavigation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import logger from '@leaflink/snitch';\n  import kebabCase from 'lodash-es/kebabCase';\n  import { onMounted, ref, watch } from 'vue';\n  import { RouteLocationRaw, useRoute, useRouter } from 'vue-router';\n\n  import Tab, { type TabProps } from '../Tab/Tab.vue';\n  import Tabs from '../Tabs/Tabs.vue';\n\n  defineOptions({\n    name: 'll-page-navigation',\n  });\n\n  export interface NavItem extends Omit<TabProps, 'value'> {\n    /**\n     * The tab's label\n     */\n    label: string;\n\n    /**\n     * The tab's label\n     */\n    value?: string;\n  }\n\n  export interface PageNavigationProps {\n    /**\n     * Index of active tab (zero-based)\n     * @deprecated Use v-model instead.\n     */\n    activeIndex?: number | string;\n\n    /**\n     * The currently active tab value\n     */\n    modelValue?: string;\n\n    /**\n     * Array of tabs. A `tab` is an object containing a `label` and either an `href` | `to`\n     */\n    items: NavItem[];\n  }\n\n  const props = withDefaults(defineProps<PageNavigationProps>(), {\n    activeIndex: undefined,\n    modelValue: '',\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emits the current active nav value\n     */\n    (e: 'update:modelValue', activeTab: string): void;\n\n    /**\n     * Emits the current active nav index\n     * @deprecated - Use v-model instead.\n     */\n    (e: 'change', activeNavIndex: number): void;\n  }>();\n\n  if (props.activeIndex) {\n    logger.info('The `activeIndex` prop is deprecated. Use `v-model` instead.');\n  }\n\n  const route = useRoute();\n  const router = useRouter();\n\n  // this ref is needed to keep track of the active tab even if v-model is not passed\n  const activeTab = ref('');\n\n  function onUpdateActiveTab(newActiveTab: string) {\n    if (newActiveTab === activeTab.value) return;\n\n    activeTab.value = newActiveTab;\n    emit('update:modelValue', newActiveTab);\n  }\n\n  watch(\n    () => props.modelValue,\n    (newValue, oldValue) => {\n      if (oldValue === newValue) return;\n\n      // TODO: Remove this once activeIndex is removed\n      const activeNavItemIndex = props.items.findIndex((item) => kebabCase(item.label) === newValue);\n      emit('change', activeNavItemIndex);\n\n      // Forcing updating activeTab when the component is in a keep alive state\n      onUpdateActiveTab(newValue);\n    },\n  );\n\n  onMounted(() => {\n    if (!props.items.length) return;\n\n    // TODO: Remove this once activeIndex is removed\n    if (props.activeIndex !== undefined) {\n      const activeTabItem = props.items[props.activeIndex];\n\n      onUpdateActiveTab(kebabCase(activeTabItem.label));\n\n      return;\n    }\n\n    if (props.modelValue !== activeTab.value) {\n      onUpdateActiveTab(props.modelValue);\n      return;\n    }\n\n    if (!router) return;\n\n    const itemMatchingRoute = props.items.find((item) => {\n      if (item?.disabled || (!item?.to && !item?.href)) return;\n\n      const { path } = router.resolve((item?.to as RouteLocationRaw) || (item?.href as string));\n\n      if (path === route.path) {\n        return true;\n      }\n\n      if (!route.path.includes(path)) return;\n\n      const sliceIndex = (route.path.length - route.path.lastIndexOf('/')) * -1;\n      const parentPath = route.path.slice(0, sliceIndex);\n\n      return path === parentPath;\n    });\n\n    if (!itemMatchingRoute) return;\n\n    onUpdateActiveTab(itemMatchingRoute?.value || kebabCase(itemMatchingRoute.label));\n  });\n</script>\n\n<template>\n  <nav class=\"stash-page-navigation container\" data-test=\"stash-page-navigation\">\n    <Tabs :active-tab=\"activeTab\" @update:active-tab=\"onUpdateActiveTab\">\n      <Tab\n        v-for=\"(item, index) in props.items\"\n        :key=\"item.label\"\n        :value=\"item?.value || kebabCase(item.label)\"\n        :to=\"item.to\"\n        :href=\"item.href\"\n        :badge=\"item.badge\"\n        :disabled=\"item.disabled\"\n        :data-id=\"index\"\n      >\n        {{ item.label }}\n      </Tab>\n    </Tabs>\n  </nav>\n</template>\n"],"names":["props","__props","emit","__emit","logger","route","useRoute","router","useRouter","activeTab","ref","onUpdateActiveTab","newActiveTab","watch","newValue","oldValue","activeNavItemIndex","item","kebabCase","onMounted","activeTabItem","itemMatchingRoute","path","sliceIndex","parentPath","_openBlock","_createElementBlock","_hoisted_1","_createVNode","Tabs","_Fragment","index","_createBlock","Tab","_unref","_createTextVNode","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;;;;AA2CE,UAAMA,IAAQC,GAKRC,IAAOC;AAab,IAAIH,EAAM,eACRI,EAAO,KAAK,8DAA8D;AAG5E,UAAMC,IAAQC,EAAA,GACRC,IAASC,EAAA,GAGTC,IAAYC,EAAI,EAAE;AAExB,aAASC,EAAkBC,GAAsB;AAC/C,MAAIA,MAAiBH,EAAU,UAE/BA,EAAU,QAAQG,GAClBV,EAAK,qBAAqBU,CAAY;AAAA,IACxC;AAEA,WAAAC;AAAA,MACE,MAAMb,EAAM;AAAA,MACZ,CAACc,GAAUC,MAAa;AACtB,YAAIA,MAAaD,EAAU;AAG3B,cAAME,IAAqBhB,EAAM,MAAM,UAAU,CAACiB,MAASC,EAAUD,EAAK,KAAK,MAAMH,CAAQ;AAC7F,QAAAZ,EAAK,UAAUc,CAAkB,GAGjCL,EAAkBG,CAAQ;AAAA,MAC5B;AAAA,IAAA,GAGFK,EAAU,MAAM;AACd,UAAI,CAACnB,EAAM,MAAM,OAAQ;AAGzB,UAAIA,EAAM,gBAAgB,QAAW;AACnC,cAAMoB,IAAgBpB,EAAM,MAAMA,EAAM,WAAW;AAEnD,QAAAW,EAAkBO,EAAUE,EAAc,KAAK,CAAC;AAEhD;AAAA,MACF;AAEA,UAAIpB,EAAM,eAAeS,EAAU,OAAO;AACxC,QAAAE,EAAkBX,EAAM,UAAU;AAClC;AAAA,MACF;AAEA,UAAI,CAACO,EAAQ;AAEb,YAAMc,IAAoBrB,EAAM,MAAM,KAAK,CAACiB,MAAS;AACnD,YAAIA,GAAM,YAAa,CAACA,GAAM,MAAM,CAACA,GAAM,KAAO;AAElD,cAAM,EAAE,MAAAK,MAASf,EAAO,QAASU,GAAM,MAA4BA,GAAM,IAAe;AAExF,YAAIK,MAASjB,EAAM;AACjB,iBAAO;AAGT,YAAI,CAACA,EAAM,KAAK,SAASiB,CAAI,EAAG;AAEhC,cAAMC,KAAclB,EAAM,KAAK,SAASA,EAAM,KAAK,YAAY,GAAG,KAAK,IACjEmB,IAAanB,EAAM,KAAK,MAAM,GAAGkB,CAAU;AAEjD,eAAOD,MAASE;AAAA,MAClB,CAAC;AAED,MAAKH,KAELV,EAAkBU,GAAmB,SAASH,EAAUG,EAAkB,KAAK,CAAC;AAAA,IAClF,CAAC,cAIDI,EAAA,GAAAC,EAeM,OAfNC,GAeM;AAAA,MAdJC,EAaOC,GAAA;AAAA,QAbA,cAAYpB,EAAA;AAAA,QAAY,sBAAmBE;AAAA,MAAA;mBAE9C,MAAoC;AAAA,WADtCc,EAAA,EAAA,GAAAC,EAWMI,WAVoB9B,EAAM,OAAK,CAA3BiB,GAAMc,YADhBC,EAWMC,GAAA;AAAA,YATH,KAAKhB,EAAK;AAAA,YACV,OAAOA,GAAM,SAASiB,EAAAhB,CAAA,EAAUD,EAAK,KAAK;AAAA,YAC1C,IAAIA,EAAK;AAAA,YACT,MAAMA,EAAK;AAAA,YACX,OAAOA,EAAK;AAAA,YACZ,UAAUA,EAAK;AAAA,YACf,WAASc;AAAA,UAAA;uBAEV,MAAgB;AAAA,cAAbI,EAAAC,EAAAnB,EAAK,KAAK,GAAA,CAAA;AAAA,YAAA;;;;;;;;;"}
+{"version":3,"file":"PageNavigation.js","sources":["../src/components/PageNavigation/PageNavigation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import logger from '@leaflink/snitch';\n  import kebabCase from 'lodash-es/kebabCase';\n  import { onMounted, ref, watch } from 'vue';\n  import { RouteLocationRaw, useRoute, useRouter } from 'vue-router';\n\n  import Tab, { type TabProps } from '../Tab/Tab.vue';\n  import Tabs from '../Tabs/Tabs.vue';\n\n  defineOptions({\n    name: 'll-page-navigation',\n  });\n\n  export interface NavItem extends Omit<TabProps, 'value'> {\n    /**\n     * The tab's label\n     */\n    label: string;\n\n    /**\n     * The tab's label\n     */\n    value?: string;\n  }\n\n  export interface PageNavigationProps {\n    /**\n     * Index of active tab (zero-based)\n     * @deprecated Use v-model instead.\n     */\n    activeIndex?: number | string;\n\n    /**\n     * The currently active tab value\n     */\n    modelValue?: string;\n\n    /**\n     * Array of tabs. A `tab` is an object containing a `label` and either an `href` | `to`\n     */\n    items: NavItem[];\n  }\n\n  const props = withDefaults(defineProps<PageNavigationProps>(), {\n    activeIndex: undefined,\n    modelValue: '',\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emits the current active nav value\n     */\n    (e: 'update:modelValue', activeTab: string): void;\n\n    /**\n     * Emits the current active nav index\n     * @deprecated - Use v-model instead.\n     */\n    (e: 'change', activeNavIndex: number): void;\n  }>();\n\n  if (props.activeIndex) {\n    logger.info('The `activeIndex` prop is deprecated. Use `v-model` instead.');\n  }\n\n  const route = useRoute();\n  const router = useRouter();\n\n  // this ref is needed to keep track of the active tab even if v-model is not passed\n  const activeTab = ref('');\n\n  function onUpdateActiveTab(newActiveTab: string) {\n    if (newActiveTab === activeTab.value) return;\n\n    activeTab.value = newActiveTab;\n    emit('update:modelValue', newActiveTab);\n  }\n\n  watch(\n    () => props.modelValue,\n    (newValue, oldValue) => {\n      if (oldValue === newValue) return;\n\n      // TODO: Remove this once activeIndex is removed\n      const activeNavItemIndex = props.items.findIndex((item) => kebabCase(item.label) === newValue);\n      emit('change', activeNavItemIndex);\n\n      // Forcing updating activeTab when the component is in a keep alive state\n      onUpdateActiveTab(newValue);\n    },\n  );\n\n  onMounted(() => {\n    if (!props.items.length) return;\n\n    // TODO: Remove this once activeIndex is removed\n    if (props.activeIndex !== undefined) {\n      const activeTabItem = props.items[props.activeIndex];\n\n      onUpdateActiveTab(kebabCase(activeTabItem.label));\n\n      return;\n    }\n\n    if (props.modelValue !== activeTab.value) {\n      onUpdateActiveTab(props.modelValue);\n      return;\n    }\n\n    if (!router) return;\n\n    const itemMatchingRoute = props.items.find((item) => {\n      if (item?.disabled || (!item?.to && !item?.href)) return;\n\n      const { path } = router.resolve((item?.to as RouteLocationRaw) || (item?.href as string));\n\n      if (path === route.path) {\n        return true;\n      }\n\n      if (!route.path.includes(path)) return;\n\n      const sliceIndex = (route.path.length - route.path.lastIndexOf('/')) * -1;\n      const parentPath = route.path.slice(0, sliceIndex);\n\n      return path === parentPath;\n    });\n\n    if (!itemMatchingRoute) return;\n\n    onUpdateActiveTab(itemMatchingRoute?.value || kebabCase(itemMatchingRoute.label));\n  });\n</script>\n\n<template>\n  <nav class=\"stash-page-navigation container\" data-test=\"stash-page-navigation\">\n    <Tabs :active-tab=\"activeTab\" @update:active-tab=\"onUpdateActiveTab\">\n      <Tab\n        v-for=\"(item, index) in props.items\"\n        :key=\"item.label\"\n        :value=\"item?.value || kebabCase(item.label)\"\n        :to=\"item.to\"\n        :href=\"item.href\"\n        :badge=\"item.badge\"\n        :disabled=\"item.disabled\"\n        :data-id=\"index\"\n      >\n        {{ item.label }}\n      </Tab>\n    </Tabs>\n  </nav>\n</template>\n"],"names":["props","__props","emit","__emit","logger","route","useRoute","router","useRouter","activeTab","ref","onUpdateActiveTab","newActiveTab","watch","newValue","oldValue","activeNavItemIndex","item","kebabCase","onMounted","activeTabItem","itemMatchingRoute","path","sliceIndex","parentPath"],"mappings":";;;;;;;;;;;;;;;;;;;AA2CE,UAAMA,IAAQC,GAKRC,IAAOC;AAab,IAAIH,EAAM,eACRI,EAAO,KAAK,8DAA8D;AAG5E,UAAMC,IAAQC,EAAA,GACRC,IAASC,EAAA,GAGTC,IAAYC,EAAI,EAAE;AAExB,aAASC,EAAkBC,GAAsB;AAC/C,MAAIA,MAAiBH,EAAU,UAE/BA,EAAU,QAAQG,GAClBV,EAAK,qBAAqBU,CAAY;AAAA,IACxC;AAEA,WAAAC;AAAA,MACE,MAAMb,EAAM;AAAA,MACZ,CAACc,GAAUC,MAAa;AACtB,YAAIA,MAAaD,EAAU;AAG3B,cAAME,IAAqBhB,EAAM,MAAM,UAAU,CAACiB,MAASC,EAAUD,EAAK,KAAK,MAAMH,CAAQ;AAC7F,QAAAZ,EAAK,UAAUc,CAAkB,GAGjCL,EAAkBG,CAAQ;AAAA,MAC5B;AAAA,IAAA,GAGFK,EAAU,MAAM;AACd,UAAI,CAACnB,EAAM,MAAM,OAAQ;AAGzB,UAAIA,EAAM,gBAAgB,QAAW;AACnC,cAAMoB,IAAgBpB,EAAM,MAAMA,EAAM,WAAW;AAEnD,QAAAW,EAAkBO,EAAUE,EAAc,KAAK,CAAC;AAEhD;AAAA,MACF;AAEA,UAAIpB,EAAM,eAAeS,EAAU,OAAO;AACxC,QAAAE,EAAkBX,EAAM,UAAU;AAClC;AAAA,MACF;AAEA,UAAI,CAACO,EAAQ;AAEb,YAAMc,IAAoBrB,EAAM,MAAM,KAAK,CAACiB,MAAS;AACnD,YAAIA,KAAA,QAAAA,EAAM,YAAa,EAACA,KAAA,QAAAA,EAAM,OAAM,EAACA,KAAA,QAAAA,EAAM,MAAO;AAElD,cAAM,EAAE,MAAAK,MAASf,EAAO,SAASU,KAAA,gBAAAA,EAAM,QAA4BA,KAAA,gBAAAA,EAAM,KAAe;AAExF,YAAIK,MAASjB,EAAM;AACjB,iBAAO;AAGT,YAAI,CAACA,EAAM,KAAK,SAASiB,CAAI,EAAG;AAEhC,cAAMC,KAAclB,EAAM,KAAK,SAASA,EAAM,KAAK,YAAY,GAAG,KAAK,IACjEmB,IAAanB,EAAM,KAAK,MAAM,GAAGkB,CAAU;AAEjD,eAAOD,MAASE;AAAA,MAClB,CAAC;AAED,MAAKH,KAELV,GAAkBU,KAAA,gBAAAA,EAAmB,UAASH,EAAUG,EAAkB,KAAK,CAAC;AAAA,IAClF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/PageNavigation.vue.d.ts

@@ -1,28 +1,57 @@
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
+import { PropType } from 'vue';
 import { PublicProps } from 'vue';
 import { RouteLocationRaw } from 'vue-router';
 import { RouterLinkProps } from 'vue-router';
 
+declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+
+declare type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+
+declare type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
+declare type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+
 /**
  * Allowed attributes for the `<a>` element when the `href` prop is used.
  */
 declare type AnchorAttrs = HTMLAnchorElement['download'] | HTMLAnchorElement['hreflang'] | HTMLAnchorElement['ping'] | HTMLAnchorElement['referrerPolicy'] | HTMLAnchorElement['rel'] | HTMLAnchorElement['target'] | HTMLAnchorElement['type'];
 
-declare const _default: DefineComponent<PageNavigationProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-change: (activeNavIndex: number) => any;
-"update:modelValue": (activeTab: string) => any;
-}, string, PublicProps, Readonly<PageNavigationProps> & Readonly<{
+declare const _default: DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PageNavigationProps>, {
+activeIndex: undefined;
+modelValue: string;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+"update:modelValue": (activeTab: string) => void;
+change: (activeNavIndex: number) => void;
+}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PageNavigationProps>, {
+activeIndex: undefined;
+modelValue: string;
+}>>> & Readonly<{
 onChange?: ((activeNavIndex: number) => any) | undefined;
 "onUpdate:modelValue"?: ((activeTab: string) => any) | undefined;
 }>, {
 modelValue: string;
 activeIndex: string | number;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;
 
-declare interface NavItem extends Omit<TabProps, 'value'> {
+export declare interface NavItem extends Omit<TabProps, 'value'> {
     /**
      * The tab's label
      */
@@ -33,7 +62,7 @@ declare interface NavItem extends Omit<TabProps, 'value'> {
     value?: string;
 }
 
-declare interface PageNavigationProps {
+export declare interface PageNavigationProps {
     /**
      * Index of active tab (zero-based)
      * @deprecated Use v-model instead.

package/dist/Paginate.js.map

@@ -1 +1 @@
-{"version":3,"file":"Paginate.js","sources":["../src/components/Paginate/Paginate.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { computed, toRef, useCssModule } from 'vue';\n\n  import usePaginationStats from '../../composables/usePaginationStats/usePaginationStats';\n  import { t } from '../../locale';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({\n    name: 'll-paginate',\n  });\n\n  export interface PaginateProps {\n    /**\n     * Current page number\n     */\n    currentPage?: number;\n    /**\n     * Total number of items in list\n     */\n    listLength?: number;\n    /**\n     * Number of items per page\n     */\n    pageSize?: number;\n    /*\n     * Optional override for the next button disabled state\n     */\n    isNextDisabled?: boolean;\n    /**\n     * Variant of the pagination component\n     */\n    variant?: 'standard' | 'stats';\n  }\n\n  const props = withDefaults(defineProps<PaginateProps>(), {\n    currentPage: 1,\n    listLength: 1,\n    pageSize: 50,\n    isNextDisabled: false,\n    variant: 'standard',\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emitted when the page number changes.\n     */\n    (e: 'set-page', pageNumber: number): void;\n  }>();\n\n  const classes = useCssModule();\n\n  const pageCount = computed(() => Math.ceil(props.listLength / props.pageSize));\n\n  const pageStats =\n    props.variant === 'stats'\n      ? usePaginationStats({\n          currentPage: toRef(() => props.currentPage),\n          pageSize: toRef(() => props.pageSize),\n          totalItems: toRef(() => props.listLength),\n        })\n      : null;\n\n  /**\n   * Emits current page to list view.\n   */\n  function updatePage(currentPage: number) {\n    emit('set-page', currentPage);\n  }\n\n  /**\n   * Sets current page to next page\n   */\n  function next() {\n    if (props.currentPage < pageCount.value) {\n      updatePage(props.currentPage + 1);\n    }\n  }\n\n  /**\n   * Sets current page to previous page\n   */\n  function prev() {\n    if (props.currentPage > 1) {\n      updatePage(props.currentPage - 1);\n    }\n  }\n\n  /**\n   * Determines whether to show page\n   * @returns {boolean} - should show page in pagination component\n   */\n  function shouldShowPage(page: number): boolean {\n    const pageDiff = Math.abs(props.currentPage - page);\n\n    if (\n      pageCount.value < 10 ||\n      page === 1 ||\n      page === pageCount.value ||\n      (props.currentPage < 6 && page < 8) ||\n      (pageCount.value - props.currentPage < 5 && pageCount.value - page < 7) ||\n      pageDiff < 3\n    ) {\n      return true;\n    }\n\n    return false;\n  }\n\n  /**\n   * Determines whether to show the leading ellipsis\n   * @returns {boolean} should show or not\n   */\n  function shouldShowFirstEllipsis(page: number): boolean {\n    return pageCount.value > 9 && props.currentPage > 5 && page === 2;\n  }\n\n  /**\n   * Determines whether to show the trailing ellipsis\n   * @returns {boolean} should show or not\n   */\n  function shouldShowLastEllipsis(page: number): boolean {\n    return pageCount.value > 9 && pageCount.value - props.currentPage > 4 && page === pageCount.value - 1;\n  }\n</script>\n\n<template>\n  <div class=\"stash-paginate tw-flex tw-justify-center\" data-test=\"stash-paginate\">\n    <ul\n      class=\"stash-paginate__list tw-flex tw-items-center\"\n      :class=\"classes.pagination\"\n      data-test=\"stash-paginate|list\"\n    >\n      <button\n        :aria-label=\"t('ll.previous')\"\n        data-test=\"stash-paginate|prev-page\"\n        :class=\"classes.prev\"\n        :disabled=\"props.currentPage === 1\"\n        @click=\"prev\"\n      >\n        <Icon size=\"small\" name=\"chevron-left\" />\n      </button>\n      <span v-if=\"props.variant === 'stats'\" class=\"tw-mx-3 tw-text-ice-900\">\n        {{ t('ll.pageStats', pageStats) }}\n      </span>\n      <template v-for=\"page in pageCount\" v-else>\n        <button\n          v-if=\"shouldShowFirstEllipsis(page)\"\n          :key=\"`${page}-ellipsis`\"\n          class=\"tw-pointer-events-none\"\n          data-test=\"stash-paginate|first-ellipsis\"\n          tabindex=\"-1\"\n        >\n          &#x2026;\n        </button>\n        <button\n          v-if=\"shouldShowPage(page)\"\n          :key=\"page\"\n          data-test=\"stash-paginate|page-number\"\n          :class=\"{ [classes['is-active']]: props.currentPage === page }\"\n          @click=\"updatePage(page)\"\n        >\n          {{ page }}\n        </button>\n        <button\n          v-if=\"shouldShowLastEllipsis(page)\"\n          :key=\"`${page}-ellipsis`\"\n          class=\"tw-pointer-events-none\"\n          data-test=\"stash-paginate|last-ellipsis\"\n          tabindex=\"-1\"\n        >\n          &#x2026;\n        </button>\n      </template>\n      <button\n        :aria-label=\"t('ll.next')\"\n        data-test=\"stash-paginate|next-page\"\n        :class=\"classes.next\"\n        :disabled=\"props.isNextDisabled || props.currentPage === pageCount\"\n        @click=\"next\"\n      >\n        <Icon size=\"small\" class=\"tw-rotate-180\" name=\"chevron-left\" />\n      </button>\n    </ul>\n  </div>\n</template>\n\n<style module>\n  .pagination {\n    /* Todo: We shouldn't really be making assumptions about the outer spacing of the pagination component */\n    margin-top: theme('spacing.12');\n    z-index: 0;\n\n    a,\n    button {\n      @apply tw-border tw-border-solid tw-border-ice-200;\n      align-items: center;\n      background-color: theme('colors.white');\n      color: var(--color-blue-500);\n      cursor: pointer;\n      display: flex;\n      height: theme('height.input');\n      justify-content: center;\n      margin: 0 0 0 -1px;\n      width: theme('height.input');\n\n      &.prev {\n        border-bottom-left-radius: theme('borderRadius.DEFAULT');\n        border-top-left-radius: theme('borderRadius.DEFAULT');\n      }\n\n      &.next {\n        border-bottom-right-radius: theme('borderRadius.DEFAULT');\n        border-top-right-radius: theme('borderRadius.DEFAULT');\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &:hover {\n        text-decoration: none;\n      }\n\n      &.is-active {\n        background-color: var(--color-blue-500);\n        color: theme('colors.white');\n        pointer-events: none;\n        z-index: theme('zIndex.control');\n      }\n\n      &:disabled {\n        cursor: not-allowed;\n        opacity: 0.5;\n      }\n\n      &:not(:disabled):hover,\n      &:not(:disabled):focus,\n      &.is-active {\n        @apply tw-border tw-border-solid tw-border-blue-500;\n        position: relative;\n      }\n\n      &.is-active:focus {\n        @apply tw-bg-blue-700 tw-border-blue-700;\n      }\n    }\n  }\n</style>\n"],"names":["props","__props","emit","__emit","classes","useCssModule","pageCount","computed","pageStats","usePaginationStats","toRef","updatePage","currentPage","next","prev","shouldShowPage","page","pageDiff","shouldShowFirstEllipsis","shouldShowLastEllipsis","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeClass","_unref","t","_createVNode","Icon","_hoisted_3","_toDisplayString","_Fragment","_renderList","$event","_hoisted_4"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAkCE,UAAMA,IAAQC,GAQRC,IAAOC,GAOPC,IAAUC,EAAA,GAEVC,IAAYC,EAAS,MAAM,KAAK,KAAKP,EAAM,aAAaA,EAAM,QAAQ,CAAC,GAEvEQ,IACJR,EAAM,YAAY,UACdS,EAAmB;AAAA,MACjB,aAAaC,EAAM,MAAMV,EAAM,WAAW;AAAA,MAC1C,UAAUU,EAAM,MAAMV,EAAM,QAAQ;AAAA,MACpC,YAAYU,EAAM,MAAMV,EAAM,UAAU;AAAA,IAAA,CACzC,IACD;AAKN,aAASW,EAAWC,GAAqB;AACvC,MAAAV,EAAK,YAAYU,CAAW;AAAA,IAC9B;AAKA,aAASC,IAAO;AACd,MAAIb,EAAM,cAAcM,EAAU,SAChCK,EAAWX,EAAM,cAAc,CAAC;AAAA,IAEpC;AAKA,aAASc,IAAO;AACd,MAAId,EAAM,cAAc,KACtBW,EAAWX,EAAM,cAAc,CAAC;AAAA,IAEpC;AAMA,aAASe,EAAeC,GAAuB;AAC7C,YAAMC,IAAW,KAAK,IAAIjB,EAAM,cAAcgB,CAAI;AAElD,aACEV,EAAU,QAAQ,MAClBU,MAAS,KACTA,MAASV,EAAU,SAClBN,EAAM,cAAc,KAAKgB,IAAO,KAChCV,EAAU,QAAQN,EAAM,cAAc,KAAKM,EAAU,QAAQU,IAAO,KACrEC,IAAW;AAAA,IAMf;AAMA,aAASC,EAAwBF,GAAuB;AACtD,aAAOV,EAAU,QAAQ,KAAKN,EAAM,cAAc,KAAKgB,MAAS;AAAA,IAClE;AAMA,aAASG,EAAuBH,GAAuB;AACrD,aAAOV,EAAU,QAAQ,KAAKA,EAAU,QAAQN,EAAM,cAAc,KAAKgB,MAASV,EAAU,QAAQ;AAAA,IACtG;sBAIAc,EAAA,GAAAC,EAyDM,OAzDNC,GAyDM;AAAA,MAxDJC,EAuDK,MAAA;AAAA,QAtDH,OAAKC,EAAA,CAAC,gDACEC,EAAArB,CAAA,EAAQ,UAAU,CAAA;AAAA,QAC1B,aAAU;AAAA,MAAA;QAEVmB,EAQS,UAAA;AAAA,UAPN,cAAYE,EAAAC,CAAA,EAAC,aAAA;AAAA,UACd,aAAU;AAAA,UACT,OAAKF,EAAEC,EAAArB,CAAA,EAAQ,IAAI;AAAA,UACnB,UAAUJ,EAAM,gBAAW;AAAA,UAC3B,SAAOc;AAAA,QAAA;UAERa,EAAyCC,GAAA;AAAA,YAAnC,MAAK;AAAA,YAAQ,MAAK;AAAA,UAAA;;QAEd5B,EAAM,YAAO,WAAzBoB,EAAA,GAAAC,EAEO,QAFPQ,GAEOC,EADFL,EAAAC,CAAA,kBAAkBD,EAAAjB,CAAA,CAAS,CAAA,GAAA,CAAA,aAEhCa,EA4BWU,GAAA,EAAA,KAAA,KAAAC,EA5Bc1B,EAAA,OAAS,CAAjBU;UAEPE,EAAwBF,CAAI,UADpCK,EAQS,UAAA;AAAA,YANN,QAAQL,CAAI;AAAA,YACb,OAAM;AAAA,YACN,aAAU;AAAA,YACV,UAAS;AAAA,UAAA,GACV,KAED;UAEQD,EAAeC,CAAI,UAD3BK,EAQS,UAAA;AAAA,YANN,KAAKL;AAAA,YACN,aAAU;AAAA,YACT,YAAUS,EAAArB,CAAA,EAAO,WAAA,CAAA,GAAgBJ,EAAM,gBAAgBgB,GAAI;AAAA,YAC3D,SAAK,CAAAiB,MAAEtB,EAAWK,CAAI;AAAA,UAAA,KAEpBA,CAAI,GAAA,IAAAkB,CAAA;UAGDf,EAAuBH,CAAI,UADnCK,EAQS,UAAA;AAAA,YANN,QAAQL,CAAI;AAAA,YACb,OAAM;AAAA,YACN,aAAU;AAAA,YACV,UAAS;AAAA,UAAA,GACV,KAED;;QAEFO,EAQS,UAAA;AAAA,UAPN,cAAYE,EAAAC,CAAA,EAAC,SAAA;AAAA,UACd,aAAU;AAAA,UACT,OAAKF,EAAEC,EAAArB,CAAA,EAAQ,IAAI;AAAA,UACnB,UAAUJ,EAAM,kBAAkBA,EAAM,gBAAgBM,EAAA;AAAA,UACxD,SAAOO;AAAA,QAAA;UAERc,EAA+DC,GAAA;AAAA,YAAzD,MAAK;AAAA,YAAQ,OAAM;AAAA,YAAgB,MAAK;AAAA,UAAA;;;;;;;;;;;;;"}
+{"version":3,"file":"Paginate.js","sources":["../src/components/Paginate/Paginate.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { computed, toRef, useCssModule } from 'vue';\n\n  import usePaginationStats from '../../composables/usePaginationStats/usePaginationStats';\n  import { t } from '../../locale';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({\n    name: 'll-paginate',\n  });\n\n  export interface PaginateProps {\n    /**\n     * Current page number\n     */\n    currentPage?: number;\n    /**\n     * Total number of items in list\n     */\n    listLength?: number;\n    /**\n     * Number of items per page\n     */\n    pageSize?: number;\n    /*\n     * Optional override for the next button disabled state\n     */\n    isNextDisabled?: boolean;\n    /**\n     * Variant of the pagination component\n     */\n    variant?: 'standard' | 'stats';\n  }\n\n  const props = withDefaults(defineProps<PaginateProps>(), {\n    currentPage: 1,\n    listLength: 1,\n    pageSize: 50,\n    isNextDisabled: false,\n    variant: 'standard',\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emitted when the page number changes.\n     */\n    (e: 'set-page', pageNumber: number): void;\n  }>();\n\n  const classes = useCssModule();\n\n  const pageCount = computed(() => Math.ceil(props.listLength / props.pageSize));\n\n  const pageStats =\n    props.variant === 'stats'\n      ? usePaginationStats({\n          currentPage: toRef(() => props.currentPage),\n          pageSize: toRef(() => props.pageSize),\n          totalItems: toRef(() => props.listLength),\n        })\n      : null;\n\n  /**\n   * Emits current page to list view.\n   */\n  function updatePage(currentPage: number) {\n    emit('set-page', currentPage);\n  }\n\n  /**\n   * Sets current page to next page\n   */\n  function next() {\n    if (props.currentPage < pageCount.value) {\n      updatePage(props.currentPage + 1);\n    }\n  }\n\n  /**\n   * Sets current page to previous page\n   */\n  function prev() {\n    if (props.currentPage > 1) {\n      updatePage(props.currentPage - 1);\n    }\n  }\n\n  /**\n   * Determines whether to show page\n   * @returns {boolean} - should show page in pagination component\n   */\n  function shouldShowPage(page: number): boolean {\n    const pageDiff = Math.abs(props.currentPage - page);\n\n    if (\n      pageCount.value < 10 ||\n      page === 1 ||\n      page === pageCount.value ||\n      (props.currentPage < 6 && page < 8) ||\n      (pageCount.value - props.currentPage < 5 && pageCount.value - page < 7) ||\n      pageDiff < 3\n    ) {\n      return true;\n    }\n\n    return false;\n  }\n\n  /**\n   * Determines whether to show the leading ellipsis\n   * @returns {boolean} should show or not\n   */\n  function shouldShowFirstEllipsis(page: number): boolean {\n    return pageCount.value > 9 && props.currentPage > 5 && page === 2;\n  }\n\n  /**\n   * Determines whether to show the trailing ellipsis\n   * @returns {boolean} should show or not\n   */\n  function shouldShowLastEllipsis(page: number): boolean {\n    return pageCount.value > 9 && pageCount.value - props.currentPage > 4 && page === pageCount.value - 1;\n  }\n</script>\n\n<template>\n  <div class=\"stash-paginate tw-flex tw-justify-center\" data-test=\"stash-paginate\">\n    <ul\n      class=\"stash-paginate__list tw-flex tw-items-center\"\n      :class=\"classes.pagination\"\n      data-test=\"stash-paginate|list\"\n    >\n      <button\n        :aria-label=\"t('ll.previous')\"\n        data-test=\"stash-paginate|prev-page\"\n        :class=\"classes.prev\"\n        :disabled=\"props.currentPage === 1\"\n        @click=\"prev\"\n      >\n        <Icon size=\"small\" name=\"chevron-left\" />\n      </button>\n      <span v-if=\"props.variant === 'stats'\" class=\"tw-mx-3 tw-text-ice-900\">\n        {{ t('ll.pageStats', pageStats) }}\n      </span>\n      <template v-for=\"page in pageCount\" v-else>\n        <button\n          v-if=\"shouldShowFirstEllipsis(page)\"\n          :key=\"`${page}-ellipsis`\"\n          class=\"tw-pointer-events-none\"\n          data-test=\"stash-paginate|first-ellipsis\"\n          tabindex=\"-1\"\n        >\n          &#x2026;\n        </button>\n        <button\n          v-if=\"shouldShowPage(page)\"\n          :key=\"page\"\n          data-test=\"stash-paginate|page-number\"\n          :class=\"{ [classes['is-active']]: props.currentPage === page }\"\n          @click=\"updatePage(page)\"\n        >\n          {{ page }}\n        </button>\n        <button\n          v-if=\"shouldShowLastEllipsis(page)\"\n          :key=\"`${page}-ellipsis`\"\n          class=\"tw-pointer-events-none\"\n          data-test=\"stash-paginate|last-ellipsis\"\n          tabindex=\"-1\"\n        >\n          &#x2026;\n        </button>\n      </template>\n      <button\n        :aria-label=\"t('ll.next')\"\n        data-test=\"stash-paginate|next-page\"\n        :class=\"classes.next\"\n        :disabled=\"props.isNextDisabled || props.currentPage === pageCount\"\n        @click=\"next\"\n      >\n        <Icon size=\"small\" class=\"tw-rotate-180\" name=\"chevron-left\" />\n      </button>\n    </ul>\n  </div>\n</template>\n\n<style module>\n  .pagination {\n    /* Todo: We shouldn't really be making assumptions about the outer spacing of the pagination component */\n    margin-top: theme('spacing.12');\n    z-index: 0;\n\n    a,\n    button {\n      @apply tw-border tw-border-solid tw-border-ice-200;\n      align-items: center;\n      background-color: theme('colors.white');\n      color: var(--color-blue-500);\n      cursor: pointer;\n      display: flex;\n      height: theme('height.input');\n      justify-content: center;\n      margin: 0 0 0 -1px;\n      width: theme('height.input');\n\n      &.prev {\n        border-bottom-left-radius: theme('borderRadius.DEFAULT');\n        border-top-left-radius: theme('borderRadius.DEFAULT');\n      }\n\n      &.next {\n        border-bottom-right-radius: theme('borderRadius.DEFAULT');\n        border-top-right-radius: theme('borderRadius.DEFAULT');\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &:hover {\n        text-decoration: none;\n      }\n\n      &.is-active {\n        background-color: var(--color-blue-500);\n        color: theme('colors.white');\n        pointer-events: none;\n        z-index: theme('zIndex.control');\n      }\n\n      &:disabled {\n        cursor: not-allowed;\n        opacity: 0.5;\n      }\n\n      &:not(:disabled):hover,\n      &:not(:disabled):focus,\n      &.is-active {\n        @apply tw-border tw-border-solid tw-border-blue-500;\n        position: relative;\n      }\n\n      &.is-active:focus {\n        @apply tw-bg-blue-700 tw-border-blue-700;\n      }\n    }\n  }\n</style>\n"],"names":["props","__props","emit","__emit","classes","useCssModule","pageCount","computed","pageStats","usePaginationStats","toRef","updatePage","currentPage","next","prev","shouldShowPage","page","pageDiff","shouldShowFirstEllipsis","shouldShowLastEllipsis"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAkCE,UAAMA,IAAQC,GAQRC,IAAOC,GAOPC,IAAUC,EAAA,GAEVC,IAAYC,EAAS,MAAM,KAAK,KAAKP,EAAM,aAAaA,EAAM,QAAQ,CAAC,GAEvEQ,IACJR,EAAM,YAAY,UACdS,EAAmB;AAAA,MACjB,aAAaC,EAAM,MAAMV,EAAM,WAAW;AAAA,MAC1C,UAAUU,EAAM,MAAMV,EAAM,QAAQ;AAAA,MACpC,YAAYU,EAAM,MAAMV,EAAM,UAAU;AAAA,IAAA,CACzC,IACD;AAKN,aAASW,EAAWC,GAAqB;AACvC,MAAAV,EAAK,YAAYU,CAAW;AAAA,IAC9B;AAKA,aAASC,IAAO;AACd,MAAIb,EAAM,cAAcM,EAAU,SAChCK,EAAWX,EAAM,cAAc,CAAC;AAAA,IAEpC;AAKA,aAASc,IAAO;AACd,MAAId,EAAM,cAAc,KACtBW,EAAWX,EAAM,cAAc,CAAC;AAAA,IAEpC;AAMA,aAASe,EAAeC,GAAuB;AAC7C,YAAMC,IAAW,KAAK,IAAIjB,EAAM,cAAcgB,CAAI;AAElD,aACEV,EAAU,QAAQ,MAClBU,MAAS,KACTA,MAASV,EAAU,SAClBN,EAAM,cAAc,KAAKgB,IAAO,KAChCV,EAAU,QAAQN,EAAM,cAAc,KAAKM,EAAU,QAAQU,IAAO,KACrEC,IAAW;AAAA,IAMf;AAMA,aAASC,EAAwBF,GAAuB;AACtD,aAAOV,EAAU,QAAQ,KAAKN,EAAM,cAAc,KAAKgB,MAAS;AAAA,IAClE;AAMA,aAASG,EAAuBH,GAAuB;AACrD,aAAOV,EAAU,QAAQ,KAAKA,EAAU,QAAQN,EAAM,cAAc,KAAKgB,MAASV,EAAU,QAAQ;AAAA,IACtG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Paginate.vue.d.ts

@@ -1,11 +1,46 @@
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
+import { PropType } from 'vue';
 import { PublicProps } from 'vue';
 
-declare const _default: DefineComponent<PaginateProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-"set-page": (pageNumber: number) => any;
-}, string, PublicProps, Readonly<PaginateProps> & Readonly<{
+declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+
+declare type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+
+declare type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
+declare type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+
+declare const _default: DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PaginateProps>, {
+currentPage: number;
+listLength: number;
+pageSize: number;
+isNextDisabled: boolean;
+variant: string;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+"set-page": (pageNumber: number) => void;
+}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PaginateProps>, {
+currentPage: number;
+listLength: number;
+pageSize: number;
+isNextDisabled: boolean;
+variant: string;
+}>>> & Readonly<{
 "onSet-page"?: ((pageNumber: number) => any) | undefined;
 }>, {
 variant: "standard" | "stats";
@@ -13,10 +48,10 @@ currentPage: number;
 pageSize: number;
 listLength: number;
 isNextDisabled: boolean;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;
 
-declare interface PaginateProps {
+export declare interface PaginateProps {
     /**
      * Current page number
      */

package/dist/PlaidLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlaidLink.js","sources":["../src/components/PlaidLink/PlaidLink.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import logger from '@leaflink/snitch';\n  import { computed, ref } from 'vue';\n\n  import { LinkTokenResponse, Plaid } from '../../../types/plaid';\n  import usePlaidLink from '../../composables/usePlaidLink/usePlaidLink';\n\n  export interface PlaidLinkProps {\n    /**\n     * @deprecated Plaid does not support other URLs for loading its SDK\n     * Plaid initialization script url to be used\n     */\n    initScriptUrl?: string;\n\n    /**\n     * Key to be used in session storage for OAuth flow\n     */\n    storageKey?: string;\n\n    /**\n     * Url to be used to redirect the user from the OAuth flow\n     */\n    returnTo?: string;\n\n    /**\n     * Plaid link token\n     */\n    token?: string;\n\n    /**\n     * Plaid environment to connect\n     */\n    env?: Plaid.Environment;\n\n    /**\n     * Function that returns a link token object to be used with Plaid.\n     * `link_token` takes precedence over `token` if informed.\n     */\n    createToken?: () => Promise<LinkTokenResponse>;\n  }\n\n  const props = withDefaults(defineProps<PlaidLinkProps>(), {\n    initScriptUrl: 'https://cdn.plaid.com/link/v2/stable/link-initialize.js',\n    storageKey: undefined,\n    returnTo: window.location.href,\n    env: 'sandbox',\n    token: undefined,\n    createToken: undefined,\n  });\n\n  const internalStorageKey = computed(() => {\n    if (props.storageKey) {\n      return props.storageKey;\n    }\n\n    // returns up to the last 3 parts of the host. e.g. for `subdomain.my.domain.com` it will return `my.domain.com`\n    const host = window.location.host.split('.').splice(-3).join('.');\n\n    return `${host}-plaid`;\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emitted whenever the exit event contains errors\n     */\n    (e: 'error', error: Plaid.Error | null | Error, metadata?: Plaid.OnExitMetaData): void;\n    /**\n     * Emitted whenever the user successfully links an item\n     */\n    (e: 'success', public_token: string, metadata: Plaid.OnSuccessMetaData): void;\n    /**\n     * Emitted whenever the user exits the Link flow\n     */\n    (e: 'exit', metadata: Plaid.OnExitMetaData): void;\n    /**\n     * Emitted when the Link is ready to be opened\n     */\n    (e: 'load'): void;\n    /**\n     * Emitted at specific points during the Link flow\n     */\n    (e: 'event', eventName: Plaid.EventName, metadata: Plaid.OnEventMetaData): void;\n  }>();\n\n  const isPlaidModalOpen = ref(false);\n\n  const onExit: Plaid.OnExit = (error: Plaid.Error | null, metadata: Plaid.OnExitMetaData) => {\n    isPlaidModalOpen.value = false;\n\n    if (error) {\n      logger.error(new Error('Plaid: Error trying to link an account'), {\n        tags: { plaid: true },\n        extra: { PlaidError: error },\n      });\n      emit('error', error, metadata);\n    }\n\n    sessionStorage.removeItem(internalStorageKey.value);\n\n    emit('exit', metadata);\n  };\n\n  const onSuccess: Plaid.OnSuccess = (public_token: string, metadata: Plaid.OnSuccessMetaData) => {\n    isPlaidModalOpen.value = false;\n\n    sessionStorage.removeItem(internalStorageKey.value);\n\n    emit('success', public_token, metadata);\n  };\n\n  const onLoad: Plaid.OnLoad = (...args) => emit('load', ...args);\n\n  const onEvent: Plaid.OnEvent = (...args) => emit('event', ...args);\n\n  const plaidLinkOptions = ref<Plaid.CreateConfig>({\n    env: props.env,\n    onSuccess,\n    onEvent,\n    onLoad,\n    onExit,\n  });\n\n  const { open: openPlaidLink } = usePlaidLink(plaidLinkOptions);\n\n  async function handleClick() {\n    if (isPlaidModalOpen.value === true) {\n      return;\n    }\n\n    isPlaidModalOpen.value = true;\n\n    if (typeof props.createToken === 'function') {\n      try {\n        const { link_token } = await props.createToken();\n\n        plaidLinkOptions.value.token = link_token;\n      } catch (err) {\n        const error = new Error('Plaid: Error trying to invoke createToken');\n\n        logger.error(error, {\n          tags: { plaid: true },\n          extra: { error: err },\n        });\n\n        emit('error', error);\n      }\n    } else if (props.token) {\n      plaidLinkOptions.value.token = props.token;\n    }\n\n    if (!plaidLinkOptions.value.token) {\n      const error = new Error('Plaid: link token not found');\n\n      logger.error(error, { tags: { plaid: true } });\n      emit('error', error);\n\n      isPlaidModalOpen.value = false;\n\n      return;\n    }\n\n    sessionStorage.setItem(\n      internalStorageKey.value,\n      JSON.stringify({ token: plaidLinkOptions.value.token, returnTo: props.returnTo, env: props.env }),\n    );\n\n    openPlaidLink();\n  }\n\n  defineExpose({\n    handleClick,\n  });\n</script>\n\n<template>\n  <span data-test=\"stash-plaid-link\" @click=\"handleClick\">\n    <!-- @slot Default slot to trigger Plaid's modal -->\n    <slot :open=\"isPlaidModalOpen\"></slot>\n  </span>\n</template>\n"],"names":["props","__props","internalStorageKey","computed","emit","__emit","isPlaidModalOpen","ref","onExit","error","metadata","logger","onSuccess","public_token","onLoad","args","onEvent","plaidLinkOptions","openPlaidLink","usePlaidLink","handleClick","link_token","err","__expose","_createElementBlock","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;;AAyCE,UAAMA,IAAQC,GASRC,IAAqBC,EAAS,MAC9BH,EAAM,aACDA,EAAM,aAMR,GAFM,OAAO,SAAS,KAAK,MAAM,GAAG,EAAE,OAAO,EAAE,EAAE,KAAK,GAAG,CAElD,QACf,GAEKI,IAAOC,GAuBPC,IAAmBC,EAAI,EAAK,GAE5BC,IAAuB,CAACC,GAA2BC,MAAmC;AAC1F,MAAAJ,EAAiB,QAAQ,IAErBG,MACFE,EAAO,MAAM,IAAI,MAAM,wCAAwC,GAAG;AAAA,QAChE,MAAM,EAAE,OAAO,GAAA;AAAA,QACf,OAAO,EAAE,YAAYF,EAAA;AAAA,MAAM,CAC5B,GACDL,EAAK,SAASK,GAAOC,CAAQ,IAG/B,eAAe,WAAWR,EAAmB,KAAK,GAElDE,EAAK,QAAQM,CAAQ;AAAA,IACvB,GAEME,IAA6B,CAACC,GAAsBH,MAAsC;AAC9F,MAAAJ,EAAiB,QAAQ,IAEzB,eAAe,WAAWJ,EAAmB,KAAK,GAElDE,EAAK,WAAWS,GAAcH,CAAQ;AAAA,IACxC,GAEMI,IAAuB,IAAIC,MAASX,EAAK,QAAQ,GAAGW,CAAI,GAExDC,IAAyB,IAAID,MAASX,EAAK,SAAS,GAAGW,CAAI,GAE3DE,IAAmBV,EAAwB;AAAA,MAC/C,KAAKP,EAAM;AAAA,MACX,WAAAY;AAAA,MACA,SAAAI;AAAA,MACA,QAAAF;AAAA,MACA,QAAAN;AAAA,IAAA,CACD,GAEK,EAAE,MAAMU,MAAkBC,EAAaF,CAAgB;AAE7D,mBAAeG,IAAc;AAC3B,UAAId,EAAiB,UAAU,IAM/B;AAAA,YAFAA,EAAiB,QAAQ,IAErB,OAAON,EAAM,eAAgB;AAC/B,cAAI;AACF,kBAAM,EAAE,YAAAqB,EAAA,IAAe,MAAMrB,EAAM,YAAA;AAEnC,YAAAiB,EAAiB,MAAM,QAAQI;AAAA,UACjC,SAASC,GAAK;AACZ,kBAAMb,IAAQ,IAAI,MAAM,2CAA2C;AAEnE,YAAAE,EAAO,MAAMF,GAAO;AAAA,cAClB,MAAM,EAAE,OAAO,GAAA;AAAA,cACf,OAAO,EAAE,OAAOa,EAAA;AAAA,YAAI,CACrB,GAEDlB,EAAK,SAASK,CAAK;AAAA,UACrB;AAAA,YACF,CAAWT,EAAM,UACfiB,EAAiB,MAAM,QAAQjB,EAAM;AAGvC,YAAI,CAACiB,EAAiB,MAAM,OAAO;AACjC,gBAAMR,IAAQ,IAAI,MAAM,6BAA6B;AAErD,UAAAE,EAAO,MAAMF,GAAO,EAAE,MAAM,EAAE,OAAO,GAAA,GAAQ,GAC7CL,EAAK,SAASK,CAAK,GAEnBH,EAAiB,QAAQ;AAEzB;AAAA,QACF;AAEA,uBAAe;AAAA,UACbJ,EAAmB;AAAA,UACnB,KAAK,UAAU,EAAE,OAAOe,EAAiB,MAAM,OAAO,UAAUjB,EAAM,UAAU,KAAKA,EAAM,KAAK;AAAA,QAAA,GAGlGkB,EAAA;AAAA;AAAA,IACF;AAEA,WAAAK,EAAa;AAAA,MACX,aAAAH;AAAA,IAAA,CACD,mBAIDI,EAGO,QAAA;AAAA,MAHD,aAAU;AAAA,MAAoB,SAAOJ;AAAA,IAAA;MAEzCK,EAAsCC,EAAA,QAAA,WAAA,EAA/B,MAAMpB,EAAA,OAAgB;AAAA,IAAA;;;"}
+{"version":3,"file":"PlaidLink.js","sources":["../src/components/PlaidLink/PlaidLink.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import logger from '@leaflink/snitch';\n  import { computed, ref } from 'vue';\n\n  import { LinkTokenResponse, Plaid } from '../../../types/plaid';\n  import usePlaidLink from '../../composables/usePlaidLink/usePlaidLink';\n\n  export interface PlaidLinkProps {\n    /**\n     * @deprecated Plaid does not support other URLs for loading its SDK\n     * Plaid initialization script url to be used\n     */\n    initScriptUrl?: string;\n\n    /**\n     * Key to be used in session storage for OAuth flow\n     */\n    storageKey?: string;\n\n    /**\n     * Url to be used to redirect the user from the OAuth flow\n     */\n    returnTo?: string;\n\n    /**\n     * Plaid link token\n     */\n    token?: string;\n\n    /**\n     * Plaid environment to connect\n     */\n    env?: Plaid.Environment;\n\n    /**\n     * Function that returns a link token object to be used with Plaid.\n     * `link_token` takes precedence over `token` if informed.\n     */\n    createToken?: () => Promise<LinkTokenResponse>;\n  }\n\n  const props = withDefaults(defineProps<PlaidLinkProps>(), {\n    initScriptUrl: 'https://cdn.plaid.com/link/v2/stable/link-initialize.js',\n    storageKey: undefined,\n    returnTo: window.location.href,\n    env: 'sandbox',\n    token: undefined,\n    createToken: undefined,\n  });\n\n  const internalStorageKey = computed(() => {\n    if (props.storageKey) {\n      return props.storageKey;\n    }\n\n    // returns up to the last 3 parts of the host. e.g. for `subdomain.my.domain.com` it will return `my.domain.com`\n    const host = window.location.host.split('.').splice(-3).join('.');\n\n    return `${host}-plaid`;\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emitted whenever the exit event contains errors\n     */\n    (e: 'error', error: Plaid.Error | null | Error, metadata?: Plaid.OnExitMetaData): void;\n    /**\n     * Emitted whenever the user successfully links an item\n     */\n    (e: 'success', public_token: string, metadata: Plaid.OnSuccessMetaData): void;\n    /**\n     * Emitted whenever the user exits the Link flow\n     */\n    (e: 'exit', metadata: Plaid.OnExitMetaData): void;\n    /**\n     * Emitted when the Link is ready to be opened\n     */\n    (e: 'load'): void;\n    /**\n     * Emitted at specific points during the Link flow\n     */\n    (e: 'event', eventName: Plaid.EventName, metadata: Plaid.OnEventMetaData): void;\n  }>();\n\n  const isPlaidModalOpen = ref(false);\n\n  const onExit: Plaid.OnExit = (error: Plaid.Error | null, metadata: Plaid.OnExitMetaData) => {\n    isPlaidModalOpen.value = false;\n\n    if (error) {\n      logger.error(new Error('Plaid: Error trying to link an account'), {\n        tags: { plaid: true },\n        extra: { PlaidError: error },\n      });\n      emit('error', error, metadata);\n    }\n\n    sessionStorage.removeItem(internalStorageKey.value);\n\n    emit('exit', metadata);\n  };\n\n  const onSuccess: Plaid.OnSuccess = (public_token: string, metadata: Plaid.OnSuccessMetaData) => {\n    isPlaidModalOpen.value = false;\n\n    sessionStorage.removeItem(internalStorageKey.value);\n\n    emit('success', public_token, metadata);\n  };\n\n  const onLoad: Plaid.OnLoad = (...args) => emit('load', ...args);\n\n  const onEvent: Plaid.OnEvent = (...args) => emit('event', ...args);\n\n  const plaidLinkOptions = ref<Plaid.CreateConfig>({\n    env: props.env,\n    onSuccess,\n    onEvent,\n    onLoad,\n    onExit,\n  });\n\n  const { open: openPlaidLink } = usePlaidLink(plaidLinkOptions);\n\n  async function handleClick() {\n    if (isPlaidModalOpen.value === true) {\n      return;\n    }\n\n    isPlaidModalOpen.value = true;\n\n    if (typeof props.createToken === 'function') {\n      try {\n        const { link_token } = await props.createToken();\n\n        plaidLinkOptions.value.token = link_token;\n      } catch (err) {\n        const error = new Error('Plaid: Error trying to invoke createToken');\n\n        logger.error(error, {\n          tags: { plaid: true },\n          extra: { error: err },\n        });\n\n        emit('error', error);\n      }\n    } else if (props.token) {\n      plaidLinkOptions.value.token = props.token;\n    }\n\n    if (!plaidLinkOptions.value.token) {\n      const error = new Error('Plaid: link token not found');\n\n      logger.error(error, { tags: { plaid: true } });\n      emit('error', error);\n\n      isPlaidModalOpen.value = false;\n\n      return;\n    }\n\n    sessionStorage.setItem(\n      internalStorageKey.value,\n      JSON.stringify({ token: plaidLinkOptions.value.token, returnTo: props.returnTo, env: props.env }),\n    );\n\n    openPlaidLink();\n  }\n\n  defineExpose({\n    handleClick,\n  });\n</script>\n\n<template>\n  <span data-test=\"stash-plaid-link\" @click=\"handleClick\">\n    <!-- @slot Default slot to trigger Plaid's modal -->\n    <slot :open=\"isPlaidModalOpen\"></slot>\n  </span>\n</template>\n"],"names":["props","__props","internalStorageKey","computed","emit","__emit","isPlaidModalOpen","ref","onExit","error","metadata","logger","onSuccess","public_token","onLoad","args","onEvent","plaidLinkOptions","openPlaidLink","usePlaidLink","handleClick","link_token","err","__expose"],"mappings":";;;;;;;;;;;;;;;AAyCE,UAAMA,IAAQC,GASRC,IAAqBC,EAAS,MAC9BH,EAAM,aACDA,EAAM,aAMR,GAFM,OAAO,SAAS,KAAK,MAAM,GAAG,EAAE,OAAO,EAAE,EAAE,KAAK,GAAG,CAElD,QACf,GAEKI,IAAOC,GAuBPC,IAAmBC,EAAI,EAAK,GAE5BC,IAAuB,CAACC,GAA2BC,MAAmC;AAC1F,MAAAJ,EAAiB,QAAQ,IAErBG,MACFE,EAAO,MAAM,IAAI,MAAM,wCAAwC,GAAG;AAAA,QAChE,MAAM,EAAE,OAAO,GAAA;AAAA,QACf,OAAO,EAAE,YAAYF,EAAA;AAAA,MAAM,CAC5B,GACDL,EAAK,SAASK,GAAOC,CAAQ,IAG/B,eAAe,WAAWR,EAAmB,KAAK,GAElDE,EAAK,QAAQM,CAAQ;AAAA,IACvB,GAEME,IAA6B,CAACC,GAAsBH,MAAsC;AAC9F,MAAAJ,EAAiB,QAAQ,IAEzB,eAAe,WAAWJ,EAAmB,KAAK,GAElDE,EAAK,WAAWS,GAAcH,CAAQ;AAAA,IACxC,GAEMI,IAAuB,IAAIC,MAASX,EAAK,QAAQ,GAAGW,CAAI,GAExDC,IAAyB,IAAID,MAASX,EAAK,SAAS,GAAGW,CAAI,GAE3DE,IAAmBV,EAAwB;AAAA,MAC/C,KAAKP,EAAM;AAAA,MACX,WAAAY;AAAA,MACA,SAAAI;AAAA,MACA,QAAAF;AAAA,MACA,QAAAN;AAAA,IAAA,CACD,GAEK,EAAE,MAAMU,MAAkBC,EAAaF,CAAgB;AAE7D,mBAAeG,IAAc;AAC3B,UAAId,EAAiB,UAAU,IAM/B;AAAA,YAFAA,EAAiB,QAAQ,IAErB,OAAON,EAAM,eAAgB;AAC/B,cAAI;AACF,kBAAM,EAAE,YAAAqB,EAAA,IAAe,MAAMrB,EAAM,YAAA;AAEnC,YAAAiB,EAAiB,MAAM,QAAQI;AAAA,UACjC,SAASC,GAAK;AACZ,kBAAMb,IAAQ,IAAI,MAAM,2CAA2C;AAEnE,YAAAE,EAAO,MAAMF,GAAO;AAAA,cAClB,MAAM,EAAE,OAAO,GAAA;AAAA,cACf,OAAO,EAAE,OAAOa,EAAA;AAAA,YAAI,CACrB,GAEDlB,EAAK,SAASK,CAAK;AAAA,UACrB;AAAA,YACF,CAAWT,EAAM,UACfiB,EAAiB,MAAM,QAAQjB,EAAM;AAGvC,YAAI,CAACiB,EAAiB,MAAM,OAAO;AACjC,gBAAMR,IAAQ,IAAI,MAAM,6BAA6B;AAErD,UAAAE,EAAO,MAAMF,GAAO,EAAE,MAAM,EAAE,OAAO,GAAA,GAAQ,GAC7CL,EAAK,SAASK,CAAK,GAEnBH,EAAiB,QAAQ;AAEzB;AAAA,QACF;AAEA,uBAAe;AAAA,UACbJ,EAAmB;AAAA,UACnB,KAAK,UAAU,EAAE,OAAOe,EAAiB,MAAM,OAAO,UAAUjB,EAAM,UAAU,KAAKA,EAAM,KAAK;AAAA,QAAA,GAGlGkB,EAAA;AAAA;AAAA,IACF;AAEA,WAAAK,EAAa;AAAA,MACX,aAAAH;AAAA,IAAA,CACD;;;;;;;;"}

package/dist/PlaidLink.vue.d.ts

@@ -1,29 +1,66 @@
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
 import { Plaid } from 'plaid-link';
+import { PropType } from 'vue';
 import { PublicProps } from 'vue';
 
+declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+
+declare type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+
+declare type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};
+
+declare type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
 
-declare const _default: __VLS_WithTemplateSlots<DefineComponent<PlaidLinkProps, {
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PlaidLinkProps>, {
+initScriptUrl: string;
+storageKey: undefined;
+returnTo: string;
+env: string;
+token: undefined;
+createToken: undefined;
+}>>, {
 handleClick: typeof handleClick;
-}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-load: () => any;
-error: (error: Error | Plaid.Error | null, metadata?: Plaid.OnExitMetaData | undefined) => any;
-success: (public_token: string, metadata: Plaid.OnSuccessMetaData) => any;
-exit: (metadata: Plaid.OnExitMetaData) => any;
-event: (eventName: Plaid.EventName, metadata: Plaid.OnEventMetaData) => any;
-}, string, PublicProps, Readonly<PlaidLinkProps> & Readonly<{
-onLoad?: (() => any) | undefined;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+error: (error: Error | Plaid.Error | null, metadata?: Plaid.OnExitMetaData | undefined) => void;
+success: (public_token: string, metadata: Plaid.OnSuccessMetaData) => void;
+exit: (metadata: Plaid.OnExitMetaData) => void;
+load: () => void;
+event: (eventName: Plaid.EventName, metadata: Plaid.OnEventMetaData) => void;
+}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PlaidLinkProps>, {
+initScriptUrl: string;
+storageKey: undefined;
+returnTo: string;
+env: string;
+token: undefined;
+createToken: undefined;
+}>>> & Readonly<{
 onError?: ((error: Error | Plaid.Error | null, metadata?: Plaid.OnExitMetaData | undefined) => any) | undefined;
+onLoad?: (() => any) | undefined;
 onSuccess?: ((public_token: string, metadata: Plaid.OnSuccessMetaData) => any) | undefined;
-onExit?: ((metadata: Plaid.OnExitMetaData) => any) | undefined;
 onEvent?: ((eventName: Plaid.EventName, metadata: Plaid.OnEventMetaData) => any) | undefined;
+onExit?: ((metadata: Plaid.OnExitMetaData) => any) | undefined;
 }>, {
 initScriptUrl: string;
 storageKey: string;
@@ -31,7 +68,7 @@ returnTo: string;
 token: string;
 env: Plaid.Environment;
 createToken: () => Promise<LinkTokenResponse>;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLSpanElement>, {
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     default?(_: {
         open: boolean;
     }): any;
@@ -46,7 +83,7 @@ declare interface LinkTokenResponse {
     request_id: string;
 }
 
-declare interface PlaidLinkProps {
+export declare interface PlaidLinkProps {
     /**
      * @deprecated Plaid does not support other URLs for loading its SDK
      * Plaid initialization script url to be used

package/dist/QuickAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"QuickAction.js","sources":["../src/components/QuickAction/QuickAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, useCssModule } from 'vue';\n  import { type RouteLocationRaw } from 'vue-router';\n\n  import { IconName } from '../Icon/Icon.types';\n  import Icon from '../Icon/Icon.vue';\n\n  export interface QuickActionProps {\n    /**\n     * The title prop will show the first line of text\n     */\n    title: string;\n\n    /**\n     * The subtitle prop will show the second line of text\n     */\n    subtitle: string;\n\n    /**\n     * The `to` prop for vue-router's `RouterLink` component\n     */\n    to?: RouteLocationRaw;\n\n    /**\n     * If defined, the quick action will render as an `<a />` tag.\n     */\n    href?: string;\n\n    /**\n     * Icon to render on the left side\n     */\n    icon: IconName;\n  }\n\n  const props = defineProps<QuickActionProps>();\n  const classes = useCssModule();\n\n  const is = computed(() => {\n    if (props.to) {\n      return 'router-link';\n    }\n\n    if (props.href) {\n      return 'a';\n    }\n\n    return 'div';\n  });\n\n  const linkAttrs = computed(() => {\n    if (props.to) {\n      return {\n        to: props.to,\n      };\n    }\n\n    if (props.href) {\n      return {\n        href: props.href,\n      };\n    }\n\n    return {};\n  });\n</script>\n\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"linkAttrs\"\n    class=\"stash-quick-action tw-rounded tw-p-3 tw-shadow\"\n    :class=\"classes.root\"\n    data-test=\"stash-quick-action\"\n  >\n    <div class=\"tw-flex tw-items-center tw-gap-3\">\n      <div class=\"tw-flex tw-items-center tw-justify-center tw-rounded tw-bg-blue-100 tw-p-3\">\n        <Icon :name=\"props.icon\" class=\"tw-text-blue-500\" />\n      </div>\n      <div class=\"tw-flex-1\">\n        <h4 class=\"tw-text-blue-500\">{{ props.title }}</h4>\n        <p class=\"tw-text-xs tw-font-normal tw-text-ice-700 lg:tw-mb-0\">\n          {{ props.subtitle }}\n        </p>\n      </div>\n      <Icon name=\"arrow-right\" class=\"tw-text-blue-500\" />\n    </div>\n  </component>\n</template>\n\n<style module>\n  .root {\n    background-color: #fff;\n    border: 1px solid transparent; /* it prevents layout size shifting of extra height/width when hover */\n    cursor: pointer;\n    display: inline-block;\n  }\n\n  .root:hover,\n  .root:active,\n  .root:focus {\n    border: 1px solid var(--color-blue-500);\n    text-decoration: none;\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule","is","computed","linkAttrs","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_unref","_createElementVNode","_hoisted_1","_hoisted_2","_createVNode","Icon","_hoisted_3","_hoisted_4","_toDisplayString","_hoisted_5"],"mappings":";;;;;;;;;;;;;AAkCE,UAAMA,IAAQC,GACRC,IAAUC,EAAA,GAEVC,IAAKC,EAAS,MACdL,EAAM,KACD,gBAGLA,EAAM,OACD,MAGF,KACR,GAEKM,IAAYD,EAAS,MACrBL,EAAM,KACD;AAAA,MACL,IAAIA,EAAM;AAAA,IAAA,IAIVA,EAAM,OACD;AAAA,MACL,MAAMA,EAAM;AAAA,IAAA,IAIT,CAAA,CACR;sBAIDO,EAAA,GAAAC,EAmBYC,EAlBLL,EAAA,KAAE,GADTM,EAEUJ,EAiBE,OAjBO;AAAA,MACjB,OAAK,CAAC,kDACEK,EAAAT,CAAA,EAAQ,IAAI;AAAA,MACpB,aAAU;AAAA,IAAA;iBAEV,MAWM;AAAA,QAXNU,EAWM,OAXNC,GAWM;AAAA,UAVJD,EAEM,OAFNE,GAEM;AAAA,YADJC,EAAoDC,GAAA;AAAA,cAA7C,MAAMhB,EAAM;AAAA,cAAM,OAAM;AAAA,YAAA;;UAEjCY,EAKM,OALNK,GAKM;AAAA,YAJJL,EAAmD,MAAnDM,GAAmDC,EAAnBnB,EAAM,KAAK,GAAA,CAAA;AAAA,YAC3CY,EAEI,KAFJQ,GAEID,EADCnB,EAAM,QAAQ,GAAA,CAAA;AAAA,UAAA;UAGrBe,EAAoDC,GAAA;AAAA,YAA9C,MAAK;AAAA,YAAc,OAAM;AAAA,UAAA;;;;;;;;;;;"}
+{"version":3,"file":"QuickAction.js","sources":["../src/components/QuickAction/QuickAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, useCssModule } from 'vue';\n  import { type RouteLocationRaw } from 'vue-router';\n\n  import { IconName } from '../Icon/Icon.types';\n  import Icon from '../Icon/Icon.vue';\n\n  export interface QuickActionProps {\n    /**\n     * The title prop will show the first line of text\n     */\n    title: string;\n\n    /**\n     * The subtitle prop will show the second line of text\n     */\n    subtitle: string;\n\n    /**\n     * The `to` prop for vue-router's `RouterLink` component\n     */\n    to?: RouteLocationRaw;\n\n    /**\n     * If defined, the quick action will render as an `<a />` tag.\n     */\n    href?: string;\n\n    /**\n     * Icon to render on the left side\n     */\n    icon: IconName;\n  }\n\n  const props = defineProps<QuickActionProps>();\n  const classes = useCssModule();\n\n  const is = computed(() => {\n    if (props.to) {\n      return 'router-link';\n    }\n\n    if (props.href) {\n      return 'a';\n    }\n\n    return 'div';\n  });\n\n  const linkAttrs = computed(() => {\n    if (props.to) {\n      return {\n        to: props.to,\n      };\n    }\n\n    if (props.href) {\n      return {\n        href: props.href,\n      };\n    }\n\n    return {};\n  });\n</script>\n\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"linkAttrs\"\n    class=\"stash-quick-action tw-rounded tw-p-3 tw-shadow\"\n    :class=\"classes.root\"\n    data-test=\"stash-quick-action\"\n  >\n    <div class=\"tw-flex tw-items-center tw-gap-3\">\n      <div class=\"tw-flex tw-items-center tw-justify-center tw-rounded tw-bg-blue-100 tw-p-3\">\n        <Icon :name=\"props.icon\" class=\"tw-text-blue-500\" />\n      </div>\n      <div class=\"tw-flex-1\">\n        <h4 class=\"tw-text-blue-500\">{{ props.title }}</h4>\n        <p class=\"tw-text-xs tw-font-normal tw-text-ice-700 lg:tw-mb-0\">\n          {{ props.subtitle }}\n        </p>\n      </div>\n      <Icon name=\"arrow-right\" class=\"tw-text-blue-500\" />\n    </div>\n  </component>\n</template>\n\n<style module>\n  .root {\n    background-color: #fff;\n    border: 1px solid transparent; /* it prevents layout size shifting of extra height/width when hover */\n    cursor: pointer;\n    display: inline-block;\n  }\n\n  .root:hover,\n  .root:active,\n  .root:focus {\n    border: 1px solid var(--color-blue-500);\n    text-decoration: none;\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule","is","computed","linkAttrs"],"mappings":";;;;;;;;;;;;;AAkCE,UAAMA,IAAQC,GACRC,IAAUC,EAAA,GAEVC,IAAKC,EAAS,MACdL,EAAM,KACD,gBAGLA,EAAM,OACD,MAGF,KACR,GAEKM,IAAYD,EAAS,MACrBL,EAAM,KACD;AAAA,MACL,IAAIA,EAAM;AAAA,IAAA,IAIVA,EAAM,OACD;AAAA,MACL,MAAMA,EAAM;AAAA,IAAA,IAIT,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}