@leaflink/stash 51.10.0 → 51.11.1

package/dist/MoreActions.vue.d.ts

@@ -0,0 +1,126 @@
+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<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<MoreActionsProps>, {
+activeItemId: undefined;
+dropdownContentClass: undefined;
+actionsContainerClass: undefined;
+moreButtonText: () => any;
+dropdownMode: string;
+disableAutoDetectActions: boolean;
+moreButtonAlign: string;
+width: undefined;
+itemInDropdownClass: undefined;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<MoreActionsProps>, {
+activeItemId: undefined;
+dropdownContentClass: undefined;
+actionsContainerClass: undefined;
+moreButtonText: () => any;
+dropdownMode: string;
+disableAutoDetectActions: boolean;
+moreButtonAlign: string;
+width: undefined;
+itemInDropdownClass: undefined;
+}>>> & Readonly<{}>, {
+width: string | number;
+itemInDropdownClass: string | Record<string, boolean>;
+activeItemId: string;
+moreButtonAlign: "separate" | "together";
+dropdownContentClass: string;
+actionsContainerClass: string | Record<string, boolean>;
+moreButtonText: string;
+dropdownMode: "default" | "custom";
+disableAutoDetectActions: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
+    actions?(_: {}): any;
+    toggle?(_: {
+        toggle: () => Promise<void>;
+        isOpen: boolean;
+    }): any;
+}>;
+export default _default;
+
+export declare interface MoreActionsProps {
+    /**
+     * CSS class or classes to be applied to the dropdown content
+     */
+    dropdownContentClass?: string;
+    /**
+     * CSS class or classes to be applied to the actions container
+     */
+    actionsContainerClass?: string | Record<string, boolean> | undefined;
+    /**
+     * Text to display on the more actions button
+     */
+    moreButtonText?: string;
+    /**
+     * Optional width for the more-actions container
+     * Applies style="width: {width}" to the stash-more-actions element
+     */
+    width?: string | number;
+    /**
+     * Rendering mode for dropdown items
+     * - 'default': Button-style rendering (current behavior)
+     * - 'custom': Custom rendering through slots
+     */
+    dropdownMode?: 'default' | 'custom';
+    /**
+     * Whether to disable automatic detection of actions from first-level children in the actions slot
+     * When false (default), all direct children in the actions slot will be treated as actions
+     * without needing to manually add data-action-id attributes
+     */
+    disableAutoDetectActions?: boolean;
+    /**
+     * Whether to apply dropdown item styling automatically
+     * When enabled, applies flex layout, padding, hover effects, and other styling to dropdown items
+     */
+    autoStyleDropdownItems?: boolean;
+    /**
+     * Active item ID for highlighting in dropdown
+     * Used when autoStyleDropdownItems is enabled to show which item is currently selected
+     */
+    activeItemId?: string;
+    /**
+     * Alignment of the More button
+     * - 'separate': Button is aligned to the right edge of the actions container (default)
+     * - 'together': Button is aligned immediately after the last visible action
+     */
+    moreButtonAlign?: 'separate' | 'together';
+    /**
+     * CSS class or classes to be applied to items inside the dropdown
+     */
+    itemInDropdownClass?: string | Record<string, boolean> | undefined;
+}
+
+export { }

package/dist/ObfuscateText.js.map

@@ -1 +1 @@
-{"version":3,"file":"ObfuscateText.js","sources":["../src/components/ObfuscateText/ObfuscateText.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, ref } from 'vue';\n\n  import Button from '../Button/Button.vue';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({ name: 'll-obfuscate-text' });\n\n  import obfuscateText, { ObfuscateTextOptions } from '../../utils/obfuscateText';\n\n  export interface ObfuscateTextProps extends ObfuscateTextOptions {\n    /**\n     * The full text\n     */\n    text: string;\n\n    /**\n     * Whether to obfuscate all characters.\n     * @deprecated omit the lengthToKeep prop to achieve the same result\n     */\n    obfuscateAll?: boolean;\n\n    /**\n     * Displays a button for toggling text visibility\n     */\n    showToggle?: boolean;\n  }\n\n  const isFullTextVisible = ref(false);\n\n  const props = withDefaults(defineProps<ObfuscateTextProps>(), {\n    maskChar: '•',\n    maskCharCount: 10,\n    lengthToKeep: 0,\n    position: 'start',\n    obfuscateAll: false,\n    showToggle: false,\n  });\n\n  const obfuscatedText = computed(() => {\n    if (props.showToggle && isFullTextVisible.value) {\n      return props.text;\n    }\n\n    if (props.obfuscateAll) {\n      return props.maskChar.repeat(props.maskCharCount);\n    }\n\n    return obfuscateText(props.text, {\n      maskChar: props.maskChar,\n      maskCharCount: props.maskCharCount,\n      lengthToKeep: props.lengthToKeep,\n      position: props.position,\n    });\n  });\n</script>\n\n<template>\n  <span class=\"stash-obfuscate-text\" data-test=\"stash-obfuscate-text\">\n    {{ obfuscatedText }}\n    <Button\n      v-if=\"props.showToggle\"\n      class=\"tw-ml-1 tw-size-auto tw-p-0\"\n      icon\n      type=\"button\"\n      @click=\"isFullTextVisible = !isFullTextVisible\"\n    >\n      <Icon\n        :name=\"isFullTextVisible ? 'hide' : 'show'\"\n        class=\"tw-cursor-pointer\"\n        :class=\"isFullTextVisible ? 'stash-obfuscate-text__hide-toggle-icon' : 'stash-obfuscate-text__show-toggle-icon'\"\n        :data-test=\"\n          isFullTextVisible ? 'stash-obfuscate-text|hide-toggle-icon' : 'stash-obfuscate-text|show-toggle-icon'\n        \"\n      />\n    </Button>\n  </span>\n</template>\n"],"names":["isFullTextVisible","ref","props","__props","obfuscatedText","computed","obfuscateText","_openBlock","_createElementBlock","_hoisted_1","_createTextVNode","_toDisplayString","_createBlock","Button","_cache","$event","_createVNode","Icon","_normalizeClass"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BE,UAAMA,IAAoBC,EAAI,EAAK,GAE7BC,IAAQC,GASRC,IAAiBC,EAAS,MAC1BH,EAAM,cAAcF,EAAkB,QACjCE,EAAM,OAGXA,EAAM,eACDA,EAAM,SAAS,OAAOA,EAAM,aAAa,IAG3CI,EAAcJ,EAAM,MAAM;AAAA,MAC/B,UAAUA,EAAM;AAAA,MAChB,eAAeA,EAAM;AAAA,MACrB,cAAcA,EAAM;AAAA,MACpB,UAAUA,EAAM;AAAA,IAAA,CACjB,CACF;sBAIDK,EAAA,GAAAC,EAkBO,QAlBPC,GAkBO;AAAA,MAjBFC,EAAAC,EAAAP,EAAA,KAAc,IAAG,KACpB,CAAA;AAAA,MACQF,EAAM,mBADdU,EAeSC,GAAA;AAAA;QAbP,OAAM;AAAA,QACN,MAAA;AAAA,QACA,MAAK;AAAA,QACJ,SAAKC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAEf,EAAA,QAAiB,CAAIA,EAAA;AAAA,MAAA;mBAE7B,MAOE;AAAA,UAPFgB,EAOEC,GAAA;AAAA,YANC,MAAMjB,EAAA,QAAiB,SAAA;AAAA,YACxB,OAAKkB,EAAA,CAAC,qBACElB,EAAA,QAAiB,2CAAA,wCAAA,CAAA;AAAA,YACxB,aAAsBA,EAAA,QAAiB,0CAAA;AAAA,UAAA;;;;;;;"}
+{"version":3,"file":"ObfuscateText.js","sources":["../src/components/ObfuscateText/ObfuscateText.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, ref } from 'vue';\n\n  import Button from '../Button/Button.vue';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({ name: 'll-obfuscate-text' });\n\n  import obfuscateText, { ObfuscateTextOptions } from '../../utils/obfuscateText';\n\n  export interface ObfuscateTextProps extends ObfuscateTextOptions {\n    /**\n     * The full text\n     */\n    text: string;\n\n    /**\n     * Whether to obfuscate all characters.\n     * @deprecated omit the lengthToKeep prop to achieve the same result\n     */\n    obfuscateAll?: boolean;\n\n    /**\n     * Displays a button for toggling text visibility\n     */\n    showToggle?: boolean;\n  }\n\n  const isFullTextVisible = ref(false);\n\n  const props = withDefaults(defineProps<ObfuscateTextProps>(), {\n    maskChar: '•',\n    maskCharCount: 10,\n    lengthToKeep: 0,\n    position: 'start',\n    obfuscateAll: false,\n    showToggle: false,\n  });\n\n  const obfuscatedText = computed(() => {\n    if (props.showToggle && isFullTextVisible.value) {\n      return props.text;\n    }\n\n    if (props.obfuscateAll) {\n      return props.maskChar.repeat(props.maskCharCount);\n    }\n\n    return obfuscateText(props.text, {\n      maskChar: props.maskChar,\n      maskCharCount: props.maskCharCount,\n      lengthToKeep: props.lengthToKeep,\n      position: props.position,\n    });\n  });\n</script>\n\n<template>\n  <span class=\"stash-obfuscate-text\" data-test=\"stash-obfuscate-text\">\n    {{ obfuscatedText }}\n    <Button\n      v-if=\"props.showToggle\"\n      class=\"tw-ml-1 tw-size-auto tw-p-0\"\n      icon\n      type=\"button\"\n      @click=\"isFullTextVisible = !isFullTextVisible\"\n    >\n      <Icon\n        :name=\"isFullTextVisible ? 'hide' : 'show'\"\n        class=\"tw-cursor-pointer\"\n        :class=\"isFullTextVisible ? 'stash-obfuscate-text__hide-toggle-icon' : 'stash-obfuscate-text__show-toggle-icon'\"\n        :data-test=\"\n          isFullTextVisible ? 'stash-obfuscate-text|hide-toggle-icon' : 'stash-obfuscate-text|show-toggle-icon'\n        \"\n      />\n    </Button>\n  </span>\n</template>\n"],"names":["isFullTextVisible","ref","props","__props","obfuscatedText","computed","obfuscateText"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BQ,UAAAA,IAAoBC,EAAI,EAAK,GAE7BC,IAAQC,GASRC,IAAiBC,EAAS,MAC1BH,EAAM,cAAcF,EAAkB,QACjCE,EAAM,OAGXA,EAAM,eACDA,EAAM,SAAS,OAAOA,EAAM,aAAa,IAG3CI,EAAcJ,EAAM,MAAM;AAAA,MAC/B,UAAUA,EAAM;AAAA,MAChB,eAAeA,EAAM;AAAA,MACrB,cAAcA,EAAM;AAAA,MACpB,UAAUA,EAAM;AAAA,IAAA,CACjB,CACF;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ObfuscateText.vue.d.ts

@@ -1,16 +1,53 @@
 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<ObfuscateTextProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ObfuscateTextProps> & 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<ObfuscateTextProps>, {
+maskChar: string;
+maskCharCount: number;
+lengthToKeep: number;
+position: string;
+obfuscateAll: boolean;
+showToggle: boolean;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ObfuscateTextProps>, {
+maskChar: string;
+maskCharCount: number;
+lengthToKeep: number;
+position: string;
+obfuscateAll: boolean;
+showToggle: boolean;
+}>>> & Readonly<{}>, {
 position: "start" | "end";
 maskChar: string;
 maskCharCount: number;
 lengthToKeep: number;
 obfuscateAll: boolean;
 showToggle: boolean;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLSpanElement>;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;
 
 declare interface ObfuscateTextOptions {
@@ -34,7 +71,7 @@ declare interface ObfuscateTextOptions {
     position?: 'start' | 'end';
 }
 
-declare interface ObfuscateTextProps extends ObfuscateTextOptions {
+export declare interface ObfuscateTextProps extends ObfuscateTextOptions {
     /**
      * The full text
      */

package/dist/PageContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageContent.js","sources":["../src/components/PageContent/PageContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { useCssModule, useSlots } from 'vue';\n\n  defineOptions({\n    name: 'll-page-content',\n  });\n\n  export interface PageContentProps {\n    /**\n     * The active page navigation tab. If provided, the PageContent will render a tab panel as its root element.\n     */\n    activeTab?: string;\n  }\n\n  const props = withDefaults(defineProps<PageContentProps>(), {\n    activeTab: undefined,\n  });\n\n  const slots = useSlots();\n  const classes = useCssModule();\n</script>\n\n<template>\n  <div\n    :id=\"props.activeTab ? `tabpanel-${props.activeTab}` : undefined\"\n    class=\"stash-page-content\"\n    :class=\"[\n      classes.root,\n      {\n        [classes['stash-page-content--has-sidebar']]: !!slots.sidebar,\n      },\n    ]\"\n    data-test=\"stash-page-content\"\n    :role=\"props.activeTab ? 'tabpanel' : undefined\"\n  >\n    <div :class=\"classes['stash-page-content__main']\">\n      <!-- @slot Default content -->\n      <slot name=\"default\"></slot>\n    </div>\n\n    <aside v-if=\"!!slots.sidebar\" :class=\"classes['stash-page-content__sidebar']\">\n      <!-- @slot Sidebar content -->\n      <slot name=\"sidebar\"></slot>\n    </aside>\n  </div>\n</template>\n\n<style module>\n  .root {\n    max-width: theme('width.container'); /* 1400px */\n    padding-inline: var(--grid-gutter);\n    position: relative;\n    margin-inline: auto;\n    width: 100%;\n  }\n\n  .stash-page-content--has-sidebar {\n    display: flex;\n    flex-direction: column;\n    gap: var(--grid-gutter);\n  }\n\n  .stash-page-content--has-sidebar .stash-page-content__main {\n    flex: 1; /* 12 cols */\n    min-width: 0;\n  }\n\n  .stash-page-content--has-sidebar .stash-page-content__sidebar {\n    flex: 0;\n    min-width: 0;\n  }\n\n  @media screen('lg') {\n    .stash-page-content--has-sidebar {\n      flex-direction: row;\n    }\n\n    .stash-page-content--has-sidebar .stash-page-content__main {\n      flex: 3; /* 9 cols */\n    }\n\n    .stash-page-content--has-sidebar .stash-page-content__sidebar {\n      flex: 1; /* 3 cols */\n    }\n  }\n</style>\n"],"names":["props","__props","slots","useSlots","classes","useCssModule","_createElementBlock","_unref","_createElementVNode","_renderSlot","_ctx"],"mappings":";;;;;;;;;AAcE,UAAMA,IAAQC,GAIRC,IAAQC,EAAA,GACRC,IAAUC,EAAA;2BAIhBC,EAqBM,OAAA;AAAA,MApBH,IAAIN,EAAM,wBAAwBA,EAAM,SAAS,KAAK;AAAA,MACvD,UAAM,sBAAoB;AAAA,QACVO,EAAAH,CAAA,EAAQ;AAAA;WAAuBG,EAAAH,CAAA,EAAO,iCAAA,CAAA,GAAA,CAAA,CAAwCG,EAAAL,CAAA,EAAM;AAAA,QAAA;AAAA;MAMpG,aAAU;AAAA,MACT,MAAMF,EAAM,yBAAyB;AAAA,IAAA;MAEtCQ,EAGM,OAAA;AAAA,QAHA,SAAOD,EAAAH,CAAA,EAAO,0BAAA,CAAA;AAAA,MAAA;QAElBK,EAA4BC,EAAA,QAAA,SAAA;AAAA,MAAA;MAGfH,EAAAL,CAAA,EAAM,gBAArBI,EAGQ,SAAA;AAAA;QAHuB,SAAOC,EAAAH,CAAA,EAAO,6BAAA,CAAA;AAAA,MAAA;QAE3CK,EAA4BC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;;;;;;;"}
+{"version":3,"file":"PageContent.js","sources":["../src/components/PageContent/PageContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { useCssModule, useSlots } from 'vue';\n\n  defineOptions({\n    name: 'll-page-content',\n  });\n\n  export interface PageContentProps {\n    /**\n     * The active page navigation tab. If provided, the PageContent will render a tab panel as its root element.\n     */\n    activeTab?: string;\n  }\n\n  const props = withDefaults(defineProps<PageContentProps>(), {\n    activeTab: undefined,\n  });\n\n  const slots = useSlots();\n  const classes = useCssModule();\n</script>\n\n<template>\n  <div\n    :id=\"props.activeTab ? `tabpanel-${props.activeTab}` : undefined\"\n    class=\"stash-page-content\"\n    :class=\"[\n      classes.root,\n      {\n        [classes['stash-page-content--has-sidebar']]: !!slots.sidebar,\n      },\n    ]\"\n    data-test=\"stash-page-content\"\n    :role=\"props.activeTab ? 'tabpanel' : undefined\"\n  >\n    <div :class=\"classes['stash-page-content__main']\">\n      <!-- @slot Default content -->\n      <slot name=\"default\"></slot>\n    </div>\n\n    <aside v-if=\"!!slots.sidebar\" :class=\"classes['stash-page-content__sidebar']\">\n      <!-- @slot Sidebar content -->\n      <slot name=\"sidebar\"></slot>\n    </aside>\n  </div>\n</template>\n\n<style module>\n  .root {\n    max-width: theme('width.container'); /* 1400px */\n    padding-inline: var(--grid-gutter);\n    position: relative;\n    margin-inline: auto;\n    width: 100%;\n  }\n\n  .stash-page-content--has-sidebar {\n    display: flex;\n    flex-direction: column;\n    gap: var(--grid-gutter);\n  }\n\n  .stash-page-content--has-sidebar .stash-page-content__main {\n    flex: 1; /* 12 cols */\n    min-width: 0;\n  }\n\n  .stash-page-content--has-sidebar .stash-page-content__sidebar {\n    flex: 0;\n    min-width: 0;\n  }\n\n  @media screen('lg') {\n    .stash-page-content--has-sidebar {\n      flex-direction: row;\n    }\n\n    .stash-page-content--has-sidebar .stash-page-content__main {\n      flex: 3; /* 9 cols */\n    }\n\n    .stash-page-content--has-sidebar .stash-page-content__sidebar {\n      flex: 1; /* 3 cols */\n    }\n  }\n</style>\n"],"names":["props","__props","slots","useSlots","classes","useCssModule"],"mappings":";;;;;;;;;AAcE,UAAMA,IAAQC,GAIRC,IAAQC,EAAS,GACjBC,IAAUC,EAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/PageContent.vue.d.ts

@@ -1,23 +1,50 @@
 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<PageContentProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PageContentProps> & Readonly<{}>, {
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PageContentProps>, {
+activeTab: undefined;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PageContentProps>, {
+activeTab: undefined;
+}>>> & Readonly<{}>, {
 activeTab: string;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>, {
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;
     sidebar?(_: {}): any;
 }>;
 export default _default;
 
-declare interface PageContentProps {
+export declare interface PageContentProps {
     /**
      * The active page navigation tab. If provided, the PageContent will render a tab panel as its root element.
      */

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,GACvBC,IAAQC,EAAS,GAEjBC,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,EAAS,GACjBC,IAASC,EAAU,GAGnBC,IAAYC,EAAI,EAAE;AAExB,aAASC,EAAkBC,GAAsB;AAC3C,MAAAA,MAAiBH,EAAU,UAE/BA,EAAU,QAAQG,GAClBV,EAAK,qBAAqBU,CAAY;AAAA,IAAA;AAGxC,WAAAC;AAAA,MACE,MAAMb,EAAM;AAAA,MACZ,CAACc,GAAUC,MAAa;AACtB,YAAIA,MAAaD,EAAU;AAGrB,cAAAE,IAAqBhB,EAAM,MAAM,UAAU,CAACiB,MAASC,EAAUD,EAAK,KAAK,MAAMH,CAAQ;AAC7F,QAAAZ,EAAK,UAAUc,CAAkB,GAGjCL,EAAkBG,CAAQ;AAAA,MAAA;AAAA,IAE9B,GAEAK,EAAU,MAAM;AACV,UAAA,CAACnB,EAAM,MAAM,OAAQ;AAGrB,UAAAA,EAAM,gBAAgB,QAAW;AACnC,cAAMoB,IAAgBpB,EAAM,MAAMA,EAAM,WAAW;AAEjC,QAAAW,EAAAO,EAAUE,EAAc,KAAK,CAAC;AAEhD;AAAA,MAAA;AAGE,UAAApB,EAAM,eAAeS,EAAU,OAAO;AACxC,QAAAE,EAAkBX,EAAM,UAAU;AAClC;AAAA,MAAA;AAGF,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;AAE5C,cAAA,EAAE,MAAAK,EAAS,IAAAf,EAAO,SAASU,KAAA,gBAAAA,EAAM,QAA4BA,KAAA,gBAAAA,EAAM,KAAe;AAEpF,YAAAK,MAASjB,EAAM;AACV,iBAAA;AAGT,YAAI,CAACA,EAAM,KAAK,SAASiB,CAAI,EAAG;AAE1B,cAAAC,KAAclB,EAAM,KAAK,SAASA,EAAM,KAAK,YAAY,GAAG,KAAK,IACjEmB,IAAanB,EAAM,KAAK,MAAM,GAAGkB,CAAU;AAEjD,eAAOD,MAASE;AAAA,MAAA,CACjB;AAED,MAAKH,KAELV,GAAkBU,KAAA,gBAAAA,EAAmB,UAASH,EAAUG,EAAkB,KAAK,CAAC;AAAA,IAAA,CACjF;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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.