@leaflink/stash 51.11.0 → 51.11.1

package/dist/Module.vue.d.ts

@@ -2,9 +2,32 @@ import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { ComputedRef } from 'vue';
 import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
 import { InjectionKey } 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;
@@ -30,9 +53,13 @@ declare interface BoxProps {
     radius?: 'none' | 'rounded';
 }
 
-declare const _default: __VLS_WithTemplateSlots<DefineComponent<ModuleProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ModuleProps> & Readonly<{}>, {
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ModuleProps>, {
+variant: string;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ModuleProps>, {
+variant: string;
+}>>> & Readonly<{}>, {
 variant: "table" | "list" | "box" | "card";
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>, {
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/ModuleContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModuleContent.js","sources":["../src/components/ModuleContent/ModuleContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { inject, onBeforeMount, ref, useSlots } from 'vue';\n\n  import { MODULE_INJECTION } from '../Module/Module.keys';\n  import { ModuleVariant } from '../Module/Module.types';\n\n  defineOptions({\n    name: 'll-module-content',\n  });\n\n  const slots = useSlots();\n  const moduleVariant = ref();\n\n  onBeforeMount(() => {\n    const moduleInjectedValues = inject(MODULE_INJECTION.key, MODULE_INJECTION.defaults);\n    if (!moduleInjectedValues.variant) {\n      throw new Error('ModuleContent must be used within a Module component.');\n    }\n    moduleVariant.value = moduleInjectedValues.variant.value;\n  });\n</script>\n\n<template>\n  <div\n    class=\"stash-module-content tw-flex-1\"\n    data-test=\"stash-module-content\"\n    :class=\"{\n      'tw-px-3 tw-py-6 lg:tw-px-6': moduleVariant === ModuleVariant.Card,\n      'tw-border-t tw-border-ice-200': moduleVariant === ModuleVariant.Table || moduleVariant === ModuleVariant.List,\n    }\"\n  >\n    <div\n      v-if=\"slots['top-left'] || slots['top-right']\"\n      class=\"stash-module-content__top-slots tw-flex tw-flex-wrap tw-items-center tw-justify-between\"\n      data-test=\"stash-module-content|top-slots\"\n    >\n      <!--\n        For styling purposes, we always render both slots. In the scenario where only a top-right is\n        provided, the div wrappers ensure space-between works and puts top-right on the right side.\n      -->\n      <div class=\"tw-mb-6 tw-mr-6\" data-test=\"stash-module-content|top-left-slot\"><slot name=\"top-left\"></slot></div>\n      <div class=\"tw-mb-6\" data-test=\"stash-module-content|top-right-slot\"><slot name=\"top-right\"></slot></div>\n    </div>\n\n    <slot></slot>\n  </div>\n</template>\n"],"names":["slots","useSlots","moduleVariant","ref","onBeforeMount","moduleInjectedValues","inject","MODULE_INJECTION","_createElementBlock","_unref","ModuleVariant","_openBlock","_hoisted_1","_createElementVNode","_hoisted_2","_renderSlot","_ctx","_hoisted_3"],"mappings":";;;;;;;;;;;;;;;;;AAUE,UAAMA,IAAQC,EAAA,GACRC,IAAgBC,EAAA;AAEtB,WAAAC,EAAc,MAAM;AAClB,YAAMC,IAAuBC,EAAOC,EAAiB,KAAKA,EAAiB,QAAQ;AACnF,UAAI,CAACF,EAAqB;AACxB,cAAM,IAAI,MAAM,uDAAuD;AAEzE,MAAAH,EAAc,QAAQG,EAAqB,QAAQ;AAAA,IACrD,CAAC,mBAIDG,EAsBM,OAAA;AAAA,MArBJ,UAAM,kCAAgC;AAAA,sCAEQN,EAAA,UAAkBO,EAAAC,CAAA,EAAc;AAAA,yCAA6CR,EAAA,UAAkBO,KAAc,SAASP,EAAA,UAAkBO,EAAAC,CAAA,EAAc;AAAA,MAAA;MADpM,aAAU;AAAA,IAAA;MAOFD,EAAAT,CAAA,iBAAqBS,EAAAT,CAAA,EAAK,WAAA,KADlCW,EAAA,GAAAH,EAWM,OAXNI,GAWM;AAAA,QAFJC,EAA+G,OAA/GC,GAA+G;AAAA,UAAnCC,EAA6BC,EAAA,QAAA,UAAA;AAAA,QAAA;QACzGH,EAAyG,OAAzGI,GAAyG;AAAA,UAApCF,EAA8BC,EAAA,QAAA,WAAA;AAAA,QAAA;;MAGrGD,EAAaC,EAAA,QAAA,SAAA;AAAA,IAAA;;;"}
+{"version":3,"file":"ModuleContent.js","sources":["../src/components/ModuleContent/ModuleContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { inject, onBeforeMount, ref, useSlots } from 'vue';\n\n  import { MODULE_INJECTION } from '../Module/Module.keys';\n  import { ModuleVariant } from '../Module/Module.types';\n\n  defineOptions({\n    name: 'll-module-content',\n  });\n\n  const slots = useSlots();\n  const moduleVariant = ref();\n\n  onBeforeMount(() => {\n    const moduleInjectedValues = inject(MODULE_INJECTION.key, MODULE_INJECTION.defaults);\n    if (!moduleInjectedValues.variant) {\n      throw new Error('ModuleContent must be used within a Module component.');\n    }\n    moduleVariant.value = moduleInjectedValues.variant.value;\n  });\n</script>\n\n<template>\n  <div\n    class=\"stash-module-content tw-flex-1\"\n    data-test=\"stash-module-content\"\n    :class=\"{\n      'tw-px-3 tw-py-6 lg:tw-px-6': moduleVariant === ModuleVariant.Card,\n      'tw-border-t tw-border-ice-200': moduleVariant === ModuleVariant.Table || moduleVariant === ModuleVariant.List,\n    }\"\n  >\n    <div\n      v-if=\"slots['top-left'] || slots['top-right']\"\n      class=\"stash-module-content__top-slots tw-flex tw-flex-wrap tw-items-center tw-justify-between\"\n      data-test=\"stash-module-content|top-slots\"\n    >\n      <!--\n        For styling purposes, we always render both slots. In the scenario where only a top-right is\n        provided, the div wrappers ensure space-between works and puts top-right on the right side.\n      -->\n      <div class=\"tw-mb-6 tw-mr-6\" data-test=\"stash-module-content|top-left-slot\"><slot name=\"top-left\"></slot></div>\n      <div class=\"tw-mb-6\" data-test=\"stash-module-content|top-right-slot\"><slot name=\"top-right\"></slot></div>\n    </div>\n\n    <slot></slot>\n  </div>\n</template>\n"],"names":["slots","useSlots","moduleVariant","ref","onBeforeMount","moduleInjectedValues","inject","MODULE_INJECTION"],"mappings":";;;;;;;;;;;;;;;;;AAUE,UAAMA,IAAQC,EAAS,GACjBC,IAAgBC,EAAI;AAE1B,WAAAC,EAAc,MAAM;AAClB,YAAMC,IAAuBC,EAAOC,EAAiB,KAAKA,EAAiB,QAAQ;AAC/E,UAAA,CAACF,EAAqB;AAClB,cAAA,IAAI,MAAM,uDAAuD;AAE3D,MAAAH,EAAA,QAAQG,EAAqB,QAAQ;AAAA,IAAA,CACpD;;;;;;;;;;;;;;;;;;;"}

package/dist/ModuleContent.vue.d.ts

@@ -9,9 +9,9 @@ declare type __VLS_WithTemplateSlots<T, S> = T & {
     };
 };
 
-declare const _default: __VLS_WithTemplateSlots<DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>, {
-    'top-left'?(_: {}): any;
-    'top-right'?(_: {}): any;
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
+    "top-left"?(_: {}): any;
+    "top-right"?(_: {}): any;
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/ModuleFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModuleFooter.js","sources":["../src/components/ModuleFooter/ModuleFooter.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { inject, onBeforeMount, ref } from 'vue';\n\n  import { MODULE_INJECTION } from '../Module/Module.keys';\n  import { ModuleVariant } from '../Module/Module.types';\n\n  const moduleVariant = ref();\n\n  onBeforeMount(() => {\n    const moduleInjectedValues = inject(MODULE_INJECTION.key, MODULE_INJECTION.defaults);\n    if (!moduleInjectedValues.variant) {\n      throw new Error('ModuleContent must be used within a Module component.');\n    }\n    moduleVariant.value = moduleInjectedValues.variant.value;\n  });\n</script>\n\n<template>\n  <div\n    class=\"stash-module-footer tw-flex tw-flex-wrap tw-justify-between\"\n    :class=\"{\n      'tw-rounded-b tw-border-b tw-border-ice-500 tw-px-3 tw-pb-6 tw-pt-0 lg:tw-px-6':\n        moduleVariant === ModuleVariant.Card,\n      'tw-rounded tw-bg-white tw-p-3 tw-shadow lg:tw-rounded-t-none lg:tw-px-6 lg:tw-shadow-none':\n        moduleVariant === ModuleVariant.Table || moduleVariant === ModuleVariant.List,\n      'tw-mb-0 tw-pt-3 lg:tw-pt-6': moduleVariant === ModuleVariant.Box,\n    }\"\n    data-test=\"stash-module-footer\"\n  >\n    <slot></slot>\n  </div>\n</template>\n"],"names":["moduleVariant","ref","onBeforeMount","moduleInjectedValues","inject","MODULE_INJECTION","_createElementBlock","_unref","ModuleVariant","_renderSlot","_ctx"],"mappings":";;;;;;AAME,UAAMA,IAAgBC,EAAA;AAEtB,WAAAC,EAAc,MAAM;AAClB,YAAMC,IAAuBC,EAAOC,EAAiB,KAAKA,EAAiB,QAAQ;AACnF,UAAI,CAACF,EAAqB;AACxB,cAAM,IAAI,MAAM,uDAAuD;AAEzE,MAAAH,EAAc,QAAQG,EAAqB,QAAQ;AAAA,IACrD,CAAC,mBAIDG,EAYM,OAAA;AAAA,MAXJ,UAAM,+DAA6D;AAAA,yFACsCN,EAAA,UAAkBO,EAAAC,CAAA,EAAc;AAAA,qGAAiHR,EAAA,UAAkBO,KAAc,SAASP,EAAA,UAAkBO,EAAAC,CAAA,EAAc;AAAA,sCAA0CR,EAAA,UAAkBO,EAAAC,CAAA,EAAc;AAAA,MAAA;MAO7Y,aAAU;AAAA,IAAA;MAEVC,EAAaC,EAAA,QAAA,SAAA;AAAA,IAAA;;;"}
+{"version":3,"file":"ModuleFooter.js","sources":["../src/components/ModuleFooter/ModuleFooter.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { inject, onBeforeMount, ref } from 'vue';\n\n  import { MODULE_INJECTION } from '../Module/Module.keys';\n  import { ModuleVariant } from '../Module/Module.types';\n\n  const moduleVariant = ref();\n\n  onBeforeMount(() => {\n    const moduleInjectedValues = inject(MODULE_INJECTION.key, MODULE_INJECTION.defaults);\n    if (!moduleInjectedValues.variant) {\n      throw new Error('ModuleContent must be used within a Module component.');\n    }\n    moduleVariant.value = moduleInjectedValues.variant.value;\n  });\n</script>\n\n<template>\n  <div\n    class=\"stash-module-footer tw-flex tw-flex-wrap tw-justify-between\"\n    :class=\"{\n      'tw-rounded-b tw-border-b tw-border-ice-500 tw-px-3 tw-pb-6 tw-pt-0 lg:tw-px-6':\n        moduleVariant === ModuleVariant.Card,\n      'tw-rounded tw-bg-white tw-p-3 tw-shadow lg:tw-rounded-t-none lg:tw-px-6 lg:tw-shadow-none':\n        moduleVariant === ModuleVariant.Table || moduleVariant === ModuleVariant.List,\n      'tw-mb-0 tw-pt-3 lg:tw-pt-6': moduleVariant === ModuleVariant.Box,\n    }\"\n    data-test=\"stash-module-footer\"\n  >\n    <slot></slot>\n  </div>\n</template>\n"],"names":["moduleVariant","ref","onBeforeMount","moduleInjectedValues","inject","MODULE_INJECTION"],"mappings":";;;;;;AAME,UAAMA,IAAgBC,EAAI;AAE1B,WAAAC,EAAc,MAAM;AAClB,YAAMC,IAAuBC,EAAOC,EAAiB,KAAKA,EAAiB,QAAQ;AAC/E,UAAA,CAACF,EAAqB;AAClB,cAAA,IAAI,MAAM,uDAAuD;AAE3D,MAAAH,EAAA,QAAQG,EAAqB,QAAQ;AAAA,IAAA,CACpD;;;;;;;;;;;;"}

package/dist/ModuleFooter.vue.d.ts

@@ -9,7 +9,7 @@ declare type __VLS_WithTemplateSlots<T, S> = T & {
     };
 };
 
-declare const _default: __VLS_WithTemplateSlots<DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>, {
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/ModuleHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModuleHeader.js","sources":["../src/components/ModuleHeader/ModuleHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, inject, ref, useCssModule, useSlots } from 'vue';\n\n  import { MODULE_INJECTION } from '../Module/Module.keys';\n  import { ModuleVariant } from '../Module/Module.types';\n\n  defineOptions({\n    name: 'll-module-header',\n  });\n\n  export interface ModuleHeaderProps {\n    /**\n     * Header title. Will get overridden by the `title` slot if provided.\n     */\n    title?: string;\n\n    /**\n     * Size of the header.\n     *\n     * - `small` = `h4`\n     * - `medium` = `h3`\n     * - `large` = `h2`\n     */\n    size?: 'small' | 'medium' | 'large';\n\n    /**\n     * Header description, aka subtitle. Will get overridden by the `description` slot if provided.\n     */\n    description?: string;\n\n    /**\n     * Stop the actions slot from force-wrapping on medium and smalls screens.\n     */\n    preventActionsWrap?: boolean;\n\n    /**\n     * Displays a border at the bottom\n     */\n    underline?: boolean;\n  }\n\n  const props = withDefaults(defineProps<ModuleHeaderProps>(), {\n    title: '',\n    size: 'medium',\n    description: '',\n    preventActionsWrap: false,\n    underline: false,\n  });\n  const classes = useCssModule();\n  const slots = useSlots();\n\n  // get the module variant from the parent module\n  const moduleVariant = ref();\n  const moduleInjectedValues = inject(MODULE_INJECTION.key, MODULE_INJECTION.defaults);\n  if (!moduleInjectedValues.variant) {\n    throw new Error('<ModuleHeader> must be used within a <Module> component.');\n  }\n  moduleVariant.value = moduleInjectedValues.variant.value;\n\n  const is = computed(() => {\n    let component: string;\n\n    switch (props.size) {\n      case 'small':\n        component = 'h4';\n        break;\n\n      case 'medium':\n        component = 'h3';\n        break;\n\n      case 'large':\n        component = 'h2';\n        break;\n\n      default:\n        component = 'h3';\n        break;\n    }\n\n    return component;\n  });\n\n  const isDefaultSlotSimpleString = computed(() => {\n    if (!slots.default) {\n      return false;\n    }\n\n    const defaultSlot = slots.default({});\n    return (\n      defaultSlot.length === 1 &&\n      typeof slots.default({})[0].children === 'string' &&\n      typeof slots.default({})[0].type === 'symbol'\n    );\n  });\n\n  const marginBottomClasses = computed(() => {\n    const isBoxOrTableOrList = ['box', 'table', 'list'].includes(moduleVariant.value);\n\n    if (isBoxOrTableOrList && !props.underline) {\n      return 'tw-mb-3 lg:tw-mb-6';\n    } else if (isBoxOrTableOrList && props.underline) {\n      return 'tw-mb-3';\n    } else {\n      return '';\n    }\n  });\n</script>\n\n<template>\n  <header\n    class=\"stash-module-header tw-flex tw-flex-wrap tw-justify-between\"\n    :class=\"{\n      'tw-rounded-t tw-border-b tw-border-ice-500 tw-bg-ice-100 tw-p-3 lg:tw-px-6':\n        moduleVariant === ModuleVariant.Card,\n      'tw-mb-6 tw-rounded tw-bg-white tw-px-3 tw-pt-3 tw-shadow lg:tw-mb-0 lg:tw-rounded-b-none lg:tw-px-6 lg:tw-pt-6 lg:tw-shadow-none':\n        moduleVariant === ModuleVariant.List,\n      'tw-mb-3 tw-border-b tw-border-ice-200 lg:tw-mb-6': props.underline,\n      'tw-mb-6 tw-rounded-t tw-bg-white tw-px-3 tw-pt-3 lg:tw-mb-0 lg:tw-px-6 lg:tw-pt-6':\n        moduleVariant === ModuleVariant.Table,\n    }\"\n    data-test=\"stash-module-header\"\n  >\n    <div\n      class=\"stash-module-header__content tw-mr-6\"\n      :class=\"marginBottomClasses\"\n      data-test=\"stash-module-header|content\"\n    >\n      <div class=\"tw-flex tw-items-center\">\n        <div\n          v-if=\"slots.media && props.size === 'large'\"\n          class=\"stash-module-header__content__media tw-mr-3\"\n          :class=\"classes.media\"\n          data-test=\"stash-module-header|content-media\"\n        >\n          <!-- @slot Place an illustration that sits next to the header title & description. -->\n          <slot name=\"media\"></slot>\n        </div>\n\n        <div class=\"stash-module-header__content__text\" data-test=\"stash-module-header|content-text\">\n          <!--\n            @slot Header title. **Deprecated**: Use the default slot or the `title` prop instead.\n          -->\n          <slot v-if=\"slots.title\" name=\"title\"></slot>\n\n          <template v-else-if=\"isDefaultSlotSimpleString\">\n            <component\n              :is=\"is\"\n              class=\"stash-module-header__default_slot_string tw-my-0\"\n              data-test=\"stash-module-header|default-slot-text\"\n            >\n              <!-- @slot Header title. -->\n              <slot></slot>\n            </component>\n          </template>\n          <!-- @slot Header title. Falls back to the `title` prop. -->\n          <slot v-else>\n            <component :is=\"is\" class=\"tw-my-0\">{{ props.title }}</component>\n          </slot>\n\n          <!--\n            @slot Header description, aka subtitle. Falls back to the `description` prop.\n          -->\n          <slot name=\"description\">\n            <p v-if=\"props.description\" class=\"tw-mb-0 tw-mt-3\">{{ props.description }}</p>\n          </slot>\n        </div>\n      </div>\n    </div>\n\n    <!-- todo: how can we pass a prop/class to actions in order to top align vs middle align? -->\n    <div\n      v-if=\"slots.actions\"\n      class=\"stash-module-header__actions tw-self-center\"\n      :class=\"[\n        marginBottomClasses,\n        {\n          'tw-w-full lg:tw-w-auto': !props.preventActionsWrap,\n        },\n      ]\"\n      data-test=\"stash-module-header|actions\"\n    >\n      <!-- @slot Add action buttons or other CTAs. -->\n      <slot name=\"actions\"></slot>\n    </div>\n  </header>\n</template>\n\n<style module>\n  /* max size for media/marketing illustration icons we would be passing to the slot */\n  .media {\n    max-height: 58px;\n    max-width: 58px;\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule","slots","useSlots","moduleVariant","ref","moduleInjectedValues","inject","MODULE_INJECTION","is","computed","component","isDefaultSlotSimpleString","marginBottomClasses","isBoxOrTableOrList","_createElementBlock","_unref","ModuleVariant","_createElementVNode","_normalizeClass","_hoisted_1","_renderSlot","_ctx","_hoisted_2","_openBlock","_createBlock","_resolveDynamicComponent","_createTextVNode","_toDisplayString","_hoisted_3"],"mappings":"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"}
+{"version":3,"file":"ModuleHeader.js","sources":["../src/components/ModuleHeader/ModuleHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed, inject, ref, useCssModule, useSlots } from 'vue';\n\n  import { MODULE_INJECTION } from '../Module/Module.keys';\n  import { ModuleVariant } from '../Module/Module.types';\n\n  defineOptions({\n    name: 'll-module-header',\n  });\n\n  export interface ModuleHeaderProps {\n    /**\n     * Header title. Will get overridden by the `title` slot if provided.\n     */\n    title?: string;\n\n    /**\n     * Size of the header.\n     *\n     * - `small` = `h4`\n     * - `medium` = `h3`\n     * - `large` = `h2`\n     */\n    size?: 'small' | 'medium' | 'large';\n\n    /**\n     * Header description, aka subtitle. Will get overridden by the `description` slot if provided.\n     */\n    description?: string;\n\n    /**\n     * Stop the actions slot from force-wrapping on medium and smalls screens.\n     */\n    preventActionsWrap?: boolean;\n\n    /**\n     * Displays a border at the bottom\n     */\n    underline?: boolean;\n  }\n\n  const props = withDefaults(defineProps<ModuleHeaderProps>(), {\n    title: '',\n    size: 'medium',\n    description: '',\n    preventActionsWrap: false,\n    underline: false,\n  });\n  const classes = useCssModule();\n  const slots = useSlots();\n\n  // get the module variant from the parent module\n  const moduleVariant = ref();\n  const moduleInjectedValues = inject(MODULE_INJECTION.key, MODULE_INJECTION.defaults);\n  if (!moduleInjectedValues.variant) {\n    throw new Error('<ModuleHeader> must be used within a <Module> component.');\n  }\n  moduleVariant.value = moduleInjectedValues.variant.value;\n\n  const is = computed(() => {\n    let component: string;\n\n    switch (props.size) {\n      case 'small':\n        component = 'h4';\n        break;\n\n      case 'medium':\n        component = 'h3';\n        break;\n\n      case 'large':\n        component = 'h2';\n        break;\n\n      default:\n        component = 'h3';\n        break;\n    }\n\n    return component;\n  });\n\n  const isDefaultSlotSimpleString = computed(() => {\n    if (!slots.default) {\n      return false;\n    }\n\n    const defaultSlot = slots.default({});\n    return (\n      defaultSlot.length === 1 &&\n      typeof slots.default({})[0].children === 'string' &&\n      typeof slots.default({})[0].type === 'symbol'\n    );\n  });\n\n  const marginBottomClasses = computed(() => {\n    const isBoxOrTableOrList = ['box', 'table', 'list'].includes(moduleVariant.value);\n\n    if (isBoxOrTableOrList && !props.underline) {\n      return 'tw-mb-3 lg:tw-mb-6';\n    } else if (isBoxOrTableOrList && props.underline) {\n      return 'tw-mb-3';\n    } else {\n      return '';\n    }\n  });\n</script>\n\n<template>\n  <header\n    class=\"stash-module-header tw-flex tw-flex-wrap tw-justify-between\"\n    :class=\"{\n      'tw-rounded-t tw-border-b tw-border-ice-500 tw-bg-ice-100 tw-p-3 lg:tw-px-6':\n        moduleVariant === ModuleVariant.Card,\n      'tw-mb-6 tw-rounded tw-bg-white tw-px-3 tw-pt-3 tw-shadow lg:tw-mb-0 lg:tw-rounded-b-none lg:tw-px-6 lg:tw-pt-6 lg:tw-shadow-none':\n        moduleVariant === ModuleVariant.List,\n      'tw-mb-3 tw-border-b tw-border-ice-200 lg:tw-mb-6': props.underline,\n      'tw-mb-6 tw-rounded-t tw-bg-white tw-px-3 tw-pt-3 lg:tw-mb-0 lg:tw-px-6 lg:tw-pt-6':\n        moduleVariant === ModuleVariant.Table,\n    }\"\n    data-test=\"stash-module-header\"\n  >\n    <div\n      class=\"stash-module-header__content tw-mr-6\"\n      :class=\"marginBottomClasses\"\n      data-test=\"stash-module-header|content\"\n    >\n      <div class=\"tw-flex tw-items-center\">\n        <div\n          v-if=\"slots.media && props.size === 'large'\"\n          class=\"stash-module-header__content__media tw-mr-3\"\n          :class=\"classes.media\"\n          data-test=\"stash-module-header|content-media\"\n        >\n          <!-- @slot Place an illustration that sits next to the header title & description. -->\n          <slot name=\"media\"></slot>\n        </div>\n\n        <div class=\"stash-module-header__content__text\" data-test=\"stash-module-header|content-text\">\n          <!--\n            @slot Header title. **Deprecated**: Use the default slot or the `title` prop instead.\n          -->\n          <slot v-if=\"slots.title\" name=\"title\"></slot>\n\n          <template v-else-if=\"isDefaultSlotSimpleString\">\n            <component\n              :is=\"is\"\n              class=\"stash-module-header__default_slot_string tw-my-0\"\n              data-test=\"stash-module-header|default-slot-text\"\n            >\n              <!-- @slot Header title. -->\n              <slot></slot>\n            </component>\n          </template>\n          <!-- @slot Header title. Falls back to the `title` prop. -->\n          <slot v-else>\n            <component :is=\"is\" class=\"tw-my-0\">{{ props.title }}</component>\n          </slot>\n\n          <!--\n            @slot Header description, aka subtitle. Falls back to the `description` prop.\n          -->\n          <slot name=\"description\">\n            <p v-if=\"props.description\" class=\"tw-mb-0 tw-mt-3\">{{ props.description }}</p>\n          </slot>\n        </div>\n      </div>\n    </div>\n\n    <!-- todo: how can we pass a prop/class to actions in order to top align vs middle align? -->\n    <div\n      v-if=\"slots.actions\"\n      class=\"stash-module-header__actions tw-self-center\"\n      :class=\"[\n        marginBottomClasses,\n        {\n          'tw-w-full lg:tw-w-auto': !props.preventActionsWrap,\n        },\n      ]\"\n      data-test=\"stash-module-header|actions\"\n    >\n      <!-- @slot Add action buttons or other CTAs. -->\n      <slot name=\"actions\"></slot>\n    </div>\n  </header>\n</template>\n\n<style module>\n  /* max size for media/marketing illustration icons we would be passing to the slot */\n  .media {\n    max-height: 58px;\n    max-width: 58px;\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule","slots","useSlots","moduleVariant","ref","moduleInjectedValues","inject","MODULE_INJECTION","is","computed","component","isDefaultSlotSimpleString","marginBottomClasses","isBoxOrTableOrList"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAyCE,UAAMA,IAAQC,GAORC,IAAUC,EAAa,GACvBC,IAAQC,EAAS,GAGjBC,IAAgBC,EAAI,GACpBC,IAAuBC,EAAOC,EAAiB,KAAKA,EAAiB,QAAQ;AAC/E,QAAA,CAACF,EAAqB;AAClB,YAAA,IAAI,MAAM,0DAA0D;AAE9D,IAAAF,EAAA,QAAQE,EAAqB,QAAQ;AAE7C,UAAAG,IAAKC,EAAS,MAAM;AACpB,UAAAC;AAEJ,cAAQb,EAAM,MAAM;AAAA,QAClB,KAAK;AACS,UAAAa,IAAA;AACZ;AAAA,QAEF,KAAK;AACS,UAAAA,IAAA;AACZ;AAAA,QAEF,KAAK;AACS,UAAAA,IAAA;AACZ;AAAA,QAEF;AACc,UAAAA,IAAA;AACZ;AAAA,MAAA;AAGG,aAAAA;AAAA,IAAA,CACR,GAEKC,IAA4BF,EAAS,MACpCR,EAAM,UAISA,EAAM,QAAQ,EAAE,EAEtB,WAAW,KACvB,OAAOA,EAAM,QAAQ,CAAE,CAAA,EAAE,CAAC,EAAE,YAAa,YACzC,OAAOA,EAAM,QAAQ,CAAE,CAAA,EAAE,CAAC,EAAE,QAAS,WAP9B,EASV,GAEKW,IAAsBH,EAAS,MAAM;AACnC,YAAAI,IAAqB,CAAC,OAAO,SAAS,MAAM,EAAE,SAASV,EAAc,KAAK;AAE5E,aAAAU,KAAsB,CAAChB,EAAM,YACxB,uBACEgB,KAAsBhB,EAAM,YAC9B,YAEA;AAAA,IACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ModuleHeader.vue.d.ts

@@ -1,31 +1,65 @@
 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<ModuleHeaderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ModuleHeaderProps> & Readonly<{}>, {
-size: "small" | "large" | "medium";
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ModuleHeaderProps>, {
+title: string;
+size: string;
 description: string;
+preventActionsWrap: boolean;
+underline: boolean;
+}>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ModuleHeaderProps>, {
 title: string;
+size: string;
+description: string;
 preventActionsWrap: boolean;
 underline: boolean;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>, {
+}>>> & Readonly<{}>, {
+title: string;
+size: "small" | "large" | "medium";
+description: string;
+preventActionsWrap: boolean;
+underline: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     media?(_: {}): any;
     title?(_: {}): any;
     default?(_: {}): any;
-    default?(_: {}): any;
     description?(_: {}): any;
     actions?(_: {}): any;
 }>;
 export default _default;
 
-declare interface ModuleHeaderProps {
+export declare interface ModuleHeaderProps {
     /**
      * Header title. Will get overridden by the `title` slot if provided.
      */