@vuetify/nightly 3.2.0-next-20230114.0 → 4.0.0-next-20230205.0

package/lib/components/VList/VListItem.mjs

@@ -156,7 +156,7 @@ export const VListItem = genericComponent()({
       }
     }
     useRender(() => {
-      var _slots$prepend, _slots$title, _slots$subtitle, _slots$default, _slots$append;
+      var _slots$title, _slots$subtitle, _slots$default;
       const Tag = isLink.value ? 'a' : props.tag;
       const hasColor = !list || isSelected.value || isActive.value;
       const hasTitle = slots.title || props.title;
@@ -179,7 +179,18 @@ export const VListItem = genericComponent()({
         "onClick": onClick,
         "onKeydown": isClickable.value && !isLink.value && onKeyDown
       }, {
-        default: () => [genOverlays(isClickable.value || isActive.value, 'v-list-item'), hasPrepend && _createVNode(VDefaultsProvider, {
+        default: () => [genOverlays(isClickable.value || isActive.value, 'v-list-item'), hasPrepend && _createVNode("div", {
+          "key": "prepend",
+          "class": "v-list-item__prepend"
+        }, [props.prependAvatar && _createVNode(VAvatar, {
+          "key": "prepend-avatar",
+          "density": props.density,
+          "image": props.prependAvatar
+        }, null), props.prependIcon && _createVNode(VIcon, {
+          "key": "prepend-icon",
+          "density": props.density,
+          "icon": props.prependIcon
+        }, null), slots.prepend && _createVNode(VDefaultsProvider, {
           "key": "prepend",
           "defaults": {
             VAvatar: {
@@ -195,14 +206,8 @@ export const VListItem = genericComponent()({
             }
           }
         }, {
-          default: () => [_createVNode("div", {
-            "class": "v-list-item__prepend"
-          }, [props.prependAvatar && _createVNode(VAvatar, {
-            "key": "prepend-avatar"
-          }, null), props.prependIcon && _createVNode(VIcon, {
-            "key": "prepend-icon"
-          }, null), (_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps.value)])]
-        }), _createVNode("div", {
+          default: () => [slots.prepend(slotProps.value)]
+        })]), _createVNode("div", {
           "class": "v-list-item__content",
           "data-no-activator": ""
         }, [hasTitle && _createVNode(VListItemTitle, {
@@ -217,7 +222,10 @@ export const VListItem = genericComponent()({
           default: () => [((_slots$subtitle = slots.subtitle) == null ? void 0 : _slots$subtitle.call(slots, {
             subtitle: props.subtitle
           })) ?? props.subtitle]
-        }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, slotProps.value)]), hasAppend && _createVNode(VDefaultsProvider, {
+        }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, slotProps.value)]), hasAppend && _createVNode("div", {
+          "key": "append",
+          "class": "v-list-item__append"
+        }, [slots.append && _createVNode(VDefaultsProvider, {
           "key": "append",
           "defaults": {
             VAvatar: {
@@ -233,14 +241,16 @@ export const VListItem = genericComponent()({
             }
           }
         }, {
-          default: () => [_createVNode("div", {
-            "class": "v-list-item__append"
-          }, [(_slots$append = slots.append) == null ? void 0 : _slots$append.call(slots, slotProps.value), props.appendIcon && _createVNode(VIcon, {
-            "key": "append-icon"
-          }, null), props.appendAvatar && _createVNode(VAvatar, {
-            "key": "append-avatar"
-          }, null)])]
-        })]
+          default: () => [slots.append(slotProps.value)]
+        }), props.appendIcon && _createVNode(VIcon, {
+          "key": "append-icon",
+          "density": props.density,
+          "icon": props.appendIcon
+        }, null), props.appendAvatar && _createVNode(VAvatar, {
+          "key": "append-avatar",
+          "density": props.density,
+          "image": props.appendAvatar
+        }, null)])]
       }), [[_resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
     return {};

package/lib/components/VList/VListItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VListItem.mjs","names":["VAvatar","VDefaultsProvider","VIcon","VListItemSubtitle","VListItemTitle","Ripple","genOverlays","makeVariantProps","useVariant","IconValue","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeRoundedProps","useRounded","makeRouterProps","useLink","makeTagProps","makeThemeProps","provideTheme","useList","useNestedItem","computed","watch","EventProp","genericComponent","useRender","VListItem","name","directives","props","active","type","Boolean","default","undefined","activeClass","String","activeColor","appendAvatar","appendIcon","disabled","lines","link","nav","prependAvatar","prependIcon","ripple","subtitle","Number","title","value","onClick","onClickOnce","variant","emits","click","e","setup","attrs","slots","emit","id","href","select","isSelected","isIndeterminate","isGroupActivator","root","parent","openOnSelect","list","isActive","isLink","isClickable","roundedProps","rounded","variantProps","color","val","open","immediate","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","roundedClasses","lineClasses","slotProps","navigate","onKeyDown","key","preventDefault","Tag","tag","hasColor","hasTitle","hasSubtitle","hasAppend","append","hasPrepend","prepend","updateHasPrepend","density","image","icon","VListItemAction","start","end"],"sources":["../../../src/components/VList/VListItem.tsx"],"sourcesContent":["// Styles\nimport './VListItem.sass'\n\n// Components\nimport { VAvatar } from '@/components/VAvatar'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VListItemSubtitle } from './VListItemSubtitle'\nimport { VListItemTitle } from './VListItemTitle'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\nimport { IconValue } from '@/composables/icons'\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useList } from './list'\nimport { useNestedItem } from '@/composables/nested/nested'\n\n// Utilities\nimport { computed, watch } from 'vue'\nimport { EventProp, genericComponent, useRender } from '@/util'\n\n// Types\nimport type { SlotsToProps } from '@/util'\nimport type { PropType } from 'vue'\n\ntype ListItemSlot = {\n  isActive: boolean\n  activate: (value: boolean) => void\n  isSelected: boolean\n  select: (value: boolean) => void\n}\n\nexport type ListItemTitleSlot = {\n  title?: string\n}\n\nexport type ListItemSubtitleSlot = {\n  subtitle?: string\n}\n\nexport const VListItem = genericComponent<new () => {\n  $props: SlotsToProps<{\n    prepend: [ListItemSlot]\n    append: [ListItemSlot]\n    default: [ListItemSlot]\n    title: [ListItemTitleSlot]\n    subtitle: [ListItemSubtitleSlot]\n  }>\n}>()({\n  name: 'VListItem',\n\n  directives: { Ripple },\n\n  props: {\n    active: {\n      type: Boolean,\n      default: undefined,\n    },\n    activeClass: String,\n    activeColor: String,\n    appendAvatar: String,\n    appendIcon: IconValue,\n    disabled: Boolean,\n    lines: String as PropType<'one' | 'two' | 'three'>,\n    link: {\n      type: Boolean,\n      default: undefined,\n    },\n    nav: Boolean,\n    prependAvatar: String,\n    prependIcon: IconValue,\n    ripple: {\n      type: Boolean,\n      default: true,\n    },\n    subtitle: [String, Number, Boolean],\n    title: [String, Number, Boolean],\n    value: null,\n\n    onClick: EventProp,\n    onClickOnce: EventProp,\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeRouterProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n    ...makeVariantProps({ variant: 'text' } as const),\n  },\n\n  emits: {\n    click: (e: MouseEvent | KeyboardEvent) => true,\n  },\n\n  setup (props, { attrs, slots, emit }) {\n    const link = useLink(props, attrs)\n    const id = computed(() => props.value ?? link.href.value)\n    const { select, isSelected, isIndeterminate, isGroupActivator, root, parent, openOnSelect } = useNestedItem(id, false)\n    const list = useList()\n    const isActive = computed(() =>\n      props.active !== false &&\n      (props.active || link.isActive?.value || isSelected.value)\n    )\n    const isLink = computed(() => props.link !== false && link.isLink.value)\n    const isClickable = computed(() =>\n      !props.disabled &&\n      props.link !== false &&\n      (props.link || link.isClickable.value || (props.value != null && !!list))\n    )\n\n    const roundedProps = computed(() => props.rounded || props.nav)\n    const variantProps = computed(() => ({\n      color: isActive.value ? props.activeColor ?? props.color : props.color,\n      variant: props.variant,\n    }))\n\n    watch(() => link.isActive?.value, val => {\n      if (val && parent.value != null) {\n        root.open(parent.value, true)\n      }\n\n      if (val) {\n        openOnSelect(val)\n      }\n    }, { immediate: true })\n\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(variantProps)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(roundedProps)\n    const lineClasses = computed(() => props.lines ? `v-list-item--${props.lines}-line` : undefined)\n\n    const slotProps = computed(() => ({\n      isActive: isActive.value,\n      select,\n      isSelected: isSelected.value,\n      isIndeterminate: isIndeterminate.value,\n    }))\n\n    function onClick (e: MouseEvent) {\n      emit('click', e)\n\n      if (isGroupActivator || !isClickable.value) return\n\n      link.navigate?.(e)\n      props.value != null && select(!isSelected.value, e)\n    }\n\n    function onKeyDown (e: KeyboardEvent) {\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault()\n        onClick(e as any as MouseEvent)\n      }\n    }\n\n    useRender(() => {\n      const Tag = isLink.value ? 'a' : props.tag\n      const hasColor = !list || isSelected.value || isActive.value\n      const hasTitle = (slots.title || props.title)\n      const hasSubtitle = (slots.subtitle || props.subtitle)\n      const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon)\n      const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon)\n\n      list?.updateHasPrepend(hasPrepend)\n\n      return (\n        <Tag\n          class={[\n            'v-list-item',\n            {\n              'v-list-item--active': isActive.value,\n              'v-list-item--disabled': props.disabled,\n              'v-list-item--link': isClickable.value,\n              'v-list-item--nav': props.nav,\n              'v-list-item--prepend': !hasPrepend && list?.hasPrepend.value,\n              [`${props.activeClass}`]: props.activeClass && isActive.value,\n            },\n            themeClasses.value,\n            borderClasses.value,\n            hasColor ? colorClasses.value : undefined,\n            densityClasses.value,\n            elevationClasses.value,\n            lineClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          style={[\n            hasColor ? colorStyles.value : undefined,\n            dimensionStyles.value,\n          ]}\n          href={ link.href.value }\n          tabindex={ isClickable.value ? 0 : undefined }\n          onClick={ onClick }\n          onKeydown={ isClickable.value && !isLink.value && onKeyDown }\n          v-ripple={ isClickable.value && props.ripple }\n        >\n          { genOverlays(isClickable.value || isActive.value, 'v-list-item') }\n\n          { hasPrepend && (\n            <VDefaultsProvider\n              key=\"prepend\"\n              defaults={{\n                VAvatar: {\n                  density: props.density,\n                  image: props.prependAvatar,\n                },\n                VIcon: {\n                  density: props.density,\n                  icon: props.prependIcon,\n                },\n                VListItemAction: {\n                  start: true,\n                },\n              }}\n            >\n              <div class=\"v-list-item__prepend\">\n                { props.prependAvatar && (\n                  <VAvatar key=\"prepend-avatar\" />\n                ) }\n\n                { props.prependIcon && (\n                  <VIcon key=\"prepend-icon\" />\n                ) }\n\n                { slots.prepend?.(slotProps.value) }\n              </div>\n            </VDefaultsProvider>\n          ) }\n\n          <div class=\"v-list-item__content\" data-no-activator=\"\">\n            { hasTitle && (\n              <VListItemTitle key=\"title\">\n                { slots.title?.({ title: props.title }) ?? props.title}\n              </VListItemTitle>\n            ) }\n\n            { hasSubtitle && (\n              <VListItemSubtitle key=\"subtitle\">\n                { slots.subtitle?.({ subtitle: props.subtitle }) ?? props.subtitle }\n              </VListItemSubtitle>\n            ) }\n\n            { slots.default?.(slotProps.value) }\n          </div>\n\n          { hasAppend && (\n            <VDefaultsProvider\n              key=\"append\"\n              defaults={{\n                VAvatar: {\n                  density: props.density,\n                  image: props.appendAvatar,\n                },\n                VIcon: {\n                  density: props.density,\n                  icon: props.appendIcon,\n                },\n                VListItemAction: {\n                  end: true,\n                },\n              }}\n            >\n              <div class=\"v-list-item__append\">\n                { slots.append?.(slotProps.value) }\n\n                { props.appendIcon && (\n                  <VIcon key=\"append-icon\" />\n                ) }\n\n                { props.appendAvatar && (\n                  <VAvatar key=\"append-avatar\" />\n                ) }\n              </div>\n            </VDefaultsProvider>\n          ) }\n        </Tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VListItem = InstanceType<typeof VListItem>\n"],"mappings":"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"}
+{"version":3,"file":"VListItem.mjs","names":["VAvatar","VDefaultsProvider","VIcon","VListItemSubtitle","VListItemTitle","Ripple","genOverlays","makeVariantProps","useVariant","IconValue","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeRoundedProps","useRounded","makeRouterProps","useLink","makeTagProps","makeThemeProps","provideTheme","useList","useNestedItem","computed","watch","EventProp","genericComponent","useRender","VListItem","name","directives","props","active","type","Boolean","default","undefined","activeClass","String","activeColor","appendAvatar","appendIcon","disabled","lines","link","nav","prependAvatar","prependIcon","ripple","subtitle","Number","title","value","onClick","onClickOnce","variant","emits","click","e","setup","attrs","slots","emit","id","href","select","isSelected","isIndeterminate","isGroupActivator","root","parent","openOnSelect","list","isActive","isLink","isClickable","roundedProps","rounded","variantProps","color","val","open","immediate","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","roundedClasses","lineClasses","slotProps","navigate","onKeyDown","key","preventDefault","Tag","tag","hasColor","hasTitle","hasSubtitle","hasAppend","append","hasPrepend","prepend","updateHasPrepend","density","image","icon","VListItemAction","start","end"],"sources":["../../../src/components/VList/VListItem.tsx"],"sourcesContent":["// Styles\nimport './VListItem.sass'\n\n// Components\nimport { VAvatar } from '@/components/VAvatar'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { VListItemSubtitle } from './VListItemSubtitle'\nimport { VListItemTitle } from './VListItemTitle'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\nimport { IconValue } from '@/composables/icons'\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeRouterProps, useLink } from '@/composables/router'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useList } from './list'\nimport { useNestedItem } from '@/composables/nested/nested'\n\n// Utilities\nimport { computed, watch } from 'vue'\nimport { EventProp, genericComponent, useRender } from '@/util'\n\n// Types\nimport type { SlotsToProps } from '@/util'\nimport type { PropType } from 'vue'\n\ntype ListItemSlot = {\n  isActive: boolean\n  activate: (value: boolean) => void\n  isSelected: boolean\n  select: (value: boolean) => void\n}\n\nexport type ListItemTitleSlot = {\n  title?: string\n}\n\nexport type ListItemSubtitleSlot = {\n  subtitle?: string\n}\n\nexport const VListItem = genericComponent<new () => {\n  $props: SlotsToProps<{\n    prepend: [ListItemSlot]\n    append: [ListItemSlot]\n    default: [ListItemSlot]\n    title: [ListItemTitleSlot]\n    subtitle: [ListItemSubtitleSlot]\n  }>\n}>()({\n  name: 'VListItem',\n\n  directives: { Ripple },\n\n  props: {\n    active: {\n      type: Boolean,\n      default: undefined,\n    },\n    activeClass: String,\n    activeColor: String,\n    appendAvatar: String,\n    appendIcon: IconValue,\n    disabled: Boolean,\n    lines: String as PropType<'one' | 'two' | 'three'>,\n    link: {\n      type: Boolean,\n      default: undefined,\n    },\n    nav: Boolean,\n    prependAvatar: String,\n    prependIcon: IconValue,\n    ripple: {\n      type: Boolean,\n      default: true,\n    },\n    subtitle: [String, Number, Boolean],\n    title: [String, Number, Boolean],\n    value: null,\n\n    onClick: EventProp,\n    onClickOnce: EventProp,\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeDimensionProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeRouterProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n    ...makeVariantProps({ variant: 'text' } as const),\n  },\n\n  emits: {\n    click: (e: MouseEvent | KeyboardEvent) => true,\n  },\n\n  setup (props, { attrs, slots, emit }) {\n    const link = useLink(props, attrs)\n    const id = computed(() => props.value ?? link.href.value)\n    const { select, isSelected, isIndeterminate, isGroupActivator, root, parent, openOnSelect } = useNestedItem(id, false)\n    const list = useList()\n    const isActive = computed(() =>\n      props.active !== false &&\n      (props.active || link.isActive?.value || isSelected.value)\n    )\n    const isLink = computed(() => props.link !== false && link.isLink.value)\n    const isClickable = computed(() =>\n      !props.disabled &&\n      props.link !== false &&\n      (props.link || link.isClickable.value || (props.value != null && !!list))\n    )\n\n    const roundedProps = computed(() => props.rounded || props.nav)\n    const variantProps = computed(() => ({\n      color: isActive.value ? props.activeColor ?? props.color : props.color,\n      variant: props.variant,\n    }))\n\n    watch(() => link.isActive?.value, val => {\n      if (val && parent.value != null) {\n        root.open(parent.value, true)\n      }\n\n      if (val) {\n        openOnSelect(val)\n      }\n    }, { immediate: true })\n\n    const { themeClasses } = provideTheme(props)\n    const { borderClasses } = useBorder(props)\n    const { colorClasses, colorStyles, variantClasses } = useVariant(variantProps)\n    const { densityClasses } = useDensity(props)\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(roundedProps)\n    const lineClasses = computed(() => props.lines ? `v-list-item--${props.lines}-line` : undefined)\n\n    const slotProps = computed(() => ({\n      isActive: isActive.value,\n      select,\n      isSelected: isSelected.value,\n      isIndeterminate: isIndeterminate.value,\n    }))\n\n    function onClick (e: MouseEvent) {\n      emit('click', e)\n\n      if (isGroupActivator || !isClickable.value) return\n\n      link.navigate?.(e)\n      props.value != null && select(!isSelected.value, e)\n    }\n\n    function onKeyDown (e: KeyboardEvent) {\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault()\n        onClick(e as any as MouseEvent)\n      }\n    }\n\n    useRender(() => {\n      const Tag = isLink.value ? 'a' : props.tag\n      const hasColor = !list || isSelected.value || isActive.value\n      const hasTitle = (slots.title || props.title)\n      const hasSubtitle = (slots.subtitle || props.subtitle)\n      const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon)\n      const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon)\n\n      list?.updateHasPrepend(hasPrepend)\n\n      return (\n        <Tag\n          class={[\n            'v-list-item',\n            {\n              'v-list-item--active': isActive.value,\n              'v-list-item--disabled': props.disabled,\n              'v-list-item--link': isClickable.value,\n              'v-list-item--nav': props.nav,\n              'v-list-item--prepend': !hasPrepend && list?.hasPrepend.value,\n              [`${props.activeClass}`]: props.activeClass && isActive.value,\n            },\n            themeClasses.value,\n            borderClasses.value,\n            hasColor ? colorClasses.value : undefined,\n            densityClasses.value,\n            elevationClasses.value,\n            lineClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          style={[\n            hasColor ? colorStyles.value : undefined,\n            dimensionStyles.value,\n          ]}\n          href={ link.href.value }\n          tabindex={ isClickable.value ? 0 : undefined }\n          onClick={ onClick }\n          onKeydown={ isClickable.value && !isLink.value && onKeyDown }\n          v-ripple={ isClickable.value && props.ripple }\n        >\n          { genOverlays(isClickable.value || isActive.value, 'v-list-item') }\n\n          { hasPrepend && (\n            <div key=\"prepend\" class=\"v-list-item__prepend\">\n              { props.prependAvatar && (\n                <VAvatar key=\"prepend-avatar\" density={ props.density } image={ props.prependAvatar } />\n              ) }\n\n              { props.prependIcon && (\n                <VIcon key=\"prepend-icon\" density={ props.density } icon={ props.prependIcon } />\n              ) }\n\n              { slots.prepend && (\n                <VDefaultsProvider\n                  key=\"prepend\"\n                  defaults={{\n                    VAvatar: {\n                      density: props.density,\n                      image: props.prependAvatar,\n                    },\n                    VIcon: {\n                      density: props.density,\n                      icon: props.prependIcon,\n                    },\n                    VListItemAction: {\n                      start: true,\n                    },\n                  }}\n                >\n                  { slots.prepend(slotProps.value) }\n                </VDefaultsProvider>\n              ) }\n            </div>\n          ) }\n\n          <div class=\"v-list-item__content\" data-no-activator=\"\">\n            { hasTitle && (\n              <VListItemTitle key=\"title\">\n                { slots.title?.({ title: props.title }) ?? props.title}\n              </VListItemTitle>\n            ) }\n\n            { hasSubtitle && (\n              <VListItemSubtitle key=\"subtitle\">\n                { slots.subtitle?.({ subtitle: props.subtitle }) ?? props.subtitle }\n              </VListItemSubtitle>\n            ) }\n\n            { slots.default?.(slotProps.value) }\n          </div>\n\n          { hasAppend && (\n            <div key=\"append\" class=\"v-list-item__append\">\n              { slots.append && (\n                <VDefaultsProvider\n                  key=\"append\"\n                  defaults={{\n                    VAvatar: {\n                      density: props.density,\n                      image: props.appendAvatar,\n                    },\n                    VIcon: {\n                      density: props.density,\n                      icon: props.appendIcon,\n                    },\n                    VListItemAction: {\n                      end: true,\n                    },\n                  }}\n                >\n                  { slots.append(slotProps.value) }\n                </VDefaultsProvider>\n              )}\n\n              { props.appendIcon && (\n                <VIcon key=\"append-icon\" density={ props.density } icon={ props.appendIcon } />\n              )}\n\n              { props.appendAvatar && (\n                <VAvatar key=\"append-avatar\" density={ props.density } image={ props.appendAvatar } />\n              )}\n            </div>\n          )}\n        </Tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VListItem = InstanceType<typeof VListItem>\n"],"mappings":"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"}

package/lib/components/VList/VListItem.sass

@@ -198,7 +198,7 @@
     padding-inline-end: $list-nav-padding
 
     .v-list &
-      &:not(:last-child):not(:only-child)
+      &:not(:only-child)
         margin-bottom: $list-item-nav-margin-top
 
 .v-list-item__underlay

package/lib/components/VMenu/VMenu.mjs

@@ -69,6 +69,11 @@ export const VMenu = genericComponent()({
     function onClickOutside() {
       parent == null ? void 0 : parent.closeParents();
     }
+    const activatorProps = computed(() => mergeProps({
+      'aria-haspopup': 'menu',
+      'aria-expanded': String(isActive.value),
+      'aria-owns': id.value
+    }, props.activatorProps));
     useRender(() => {
       const [overlayProps] = filterVOverlayProps(props);
       return _createVNode(VOverlay, _mergeProps({
@@ -78,11 +83,7 @@ export const VMenu = genericComponent()({
         "modelValue": isActive.value,
         "onUpdate:modelValue": $event => isActive.value = $event,
         "absolute": true,
-        "activatorProps": mergeProps({
-          'aria-haspopup': 'menu',
-          'aria-expanded': String(isActive.value),
-          'aria-owns': id.value
-        }, props.activatorProps),
+        "activatorProps": activatorProps.value,
         "onClick:outside": onClickOutside
       }, scopeId), {
         activator: slots.activator,

package/lib/components/VMenu/VMenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VMenu.mjs","names":["VDialogTransition","VDefaultsProvider","VOverlay","forwardRefs","useProxiedModel","useScopeId","computed","inject","mergeProps","provide","ref","watch","genericComponent","getUid","omit","useRender","filterVOverlayProps","makeVOverlayProps","VMenuSymbol","VMenu","name","props","id","String","closeDelay","closeOnContentClick","locationStrategy","openDelay","scrim","scrollStrategy","transition","component","emits","value","setup","slots","isActive","scopeId","uid","overlay","parent","openChildren","register","unregister","closeParents","setTimeout","val","onClickOutside","overlayProps","activatorProps","activator","default","args"],"sources":["../../../src/components/VMenu/VMenu.tsx"],"sourcesContent":["// Styles\nimport './VMenu.sass'\n\n// Components\nimport { VDialogTransition } from '@/components/transitions'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VOverlay } from '@/components/VOverlay'\n\n// Composables\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\n\n// Utilities\nimport { computed, inject, mergeProps, provide, ref, watch } from 'vue'\nimport { genericComponent, getUid, omit, useRender } from '@/util'\nimport { filterVOverlayProps, makeVOverlayProps } from '@/components/VOverlay/VOverlay'\nimport { VMenuSymbol } from './shared'\n\n// Types\nimport type { SlotsToProps } from '@/util'\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\n\nexport const VMenu = genericComponent<new () => {\n  $props: SlotsToProps<OverlaySlots>\n}>()({\n  name: 'VMenu',\n\n  props: {\n    // TODO\n    // disableKeys: Boolean,\n    id: String,\n\n    ...omit(makeVOverlayProps({\n      closeDelay: 250,\n      closeOnContentClick: true,\n      locationStrategy: 'connected' as const,\n      openDelay: 300,\n      scrim: false,\n      scrollStrategy: 'reposition' as const,\n      transition: { component: VDialogTransition },\n    }), ['absolute']),\n  },\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { scopeId } = useScopeId()\n\n    const uid = getUid()\n    const id = computed(() => props.id || `v-menu-${uid}`)\n\n    const overlay = ref<VOverlay>()\n\n    const parent = inject(VMenuSymbol, null)\n    let openChildren = 0\n    provide(VMenuSymbol, {\n      register () {\n        ++openChildren\n      },\n      unregister () {\n        --openChildren\n      },\n      closeParents () {\n        setTimeout(() => {\n          if (!openChildren) {\n            isActive.value = false\n            parent?.closeParents()\n          }\n        }, 40)\n      },\n    })\n\n    watch(isActive, val => {\n      val ? parent?.register() : parent?.unregister()\n    })\n\n    function onClickOutside () {\n      parent?.closeParents()\n    }\n\n    useRender(() => {\n      const [overlayProps] = filterVOverlayProps(props)\n\n      return (\n        <VOverlay\n          ref={ overlay }\n          class={[\n            'v-menu',\n          ]}\n          { ...overlayProps }\n          v-model={ isActive.value }\n          absolute\n          activatorProps={ mergeProps({\n            'aria-haspopup': 'menu',\n            'aria-expanded': String(isActive.value),\n            'aria-owns': id.value,\n          }, props.activatorProps) }\n          onClick:outside={ onClickOutside }\n          { ...scopeId }\n        >\n          {{\n            activator: slots.activator,\n            default: (...args) => (\n              <VDefaultsProvider root>\n                { slots.default?.(...args) }\n              </VDefaultsProvider>\n            ),\n          }}\n        </VOverlay>\n      )\n    })\n\n    return forwardRefs({ id }, overlay)\n  },\n})\n\nexport type VMenu = InstanceType<typeof VMenu>\n"],"mappings":"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"}
+{"version":3,"file":"VMenu.mjs","names":["VDialogTransition","VDefaultsProvider","VOverlay","forwardRefs","useProxiedModel","useScopeId","computed","inject","mergeProps","provide","ref","watch","genericComponent","getUid","omit","useRender","filterVOverlayProps","makeVOverlayProps","VMenuSymbol","VMenu","name","props","id","String","closeDelay","closeOnContentClick","locationStrategy","openDelay","scrim","scrollStrategy","transition","component","emits","value","setup","slots","isActive","scopeId","uid","overlay","parent","openChildren","register","unregister","closeParents","setTimeout","val","onClickOutside","activatorProps","overlayProps","activator","default","args"],"sources":["../../../src/components/VMenu/VMenu.tsx"],"sourcesContent":["// Styles\nimport './VMenu.sass'\n\n// Components\nimport { VDialogTransition } from '@/components/transitions'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VOverlay } from '@/components/VOverlay'\n\n// Composables\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\n\n// Utilities\nimport { computed, inject, mergeProps, provide, ref, watch } from 'vue'\nimport { genericComponent, getUid, omit, useRender } from '@/util'\nimport { filterVOverlayProps, makeVOverlayProps } from '@/components/VOverlay/VOverlay'\nimport { VMenuSymbol } from './shared'\n\n// Types\nimport type { SlotsToProps } from '@/util'\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\n\nexport const VMenu = genericComponent<new () => {\n  $props: SlotsToProps<OverlaySlots>\n}>()({\n  name: 'VMenu',\n\n  props: {\n    // TODO\n    // disableKeys: Boolean,\n    id: String,\n\n    ...omit(makeVOverlayProps({\n      closeDelay: 250,\n      closeOnContentClick: true,\n      locationStrategy: 'connected' as const,\n      openDelay: 300,\n      scrim: false,\n      scrollStrategy: 'reposition' as const,\n      transition: { component: VDialogTransition },\n    }), ['absolute']),\n  },\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { scopeId } = useScopeId()\n\n    const uid = getUid()\n    const id = computed(() => props.id || `v-menu-${uid}`)\n\n    const overlay = ref<VOverlay>()\n\n    const parent = inject(VMenuSymbol, null)\n    let openChildren = 0\n    provide(VMenuSymbol, {\n      register () {\n        ++openChildren\n      },\n      unregister () {\n        --openChildren\n      },\n      closeParents () {\n        setTimeout(() => {\n          if (!openChildren) {\n            isActive.value = false\n            parent?.closeParents()\n          }\n        }, 40)\n      },\n    })\n\n    watch(isActive, val => {\n      val ? parent?.register() : parent?.unregister()\n    })\n\n    function onClickOutside () {\n      parent?.closeParents()\n    }\n\n    const activatorProps = computed(() =>\n      mergeProps({\n        'aria-haspopup': 'menu',\n        'aria-expanded': String(isActive.value),\n        'aria-owns': id.value,\n      }, props.activatorProps)\n    )\n\n    useRender(() => {\n      const [overlayProps] = filterVOverlayProps(props)\n\n      return (\n        <VOverlay\n          ref={ overlay }\n          class={[\n            'v-menu',\n          ]}\n          { ...overlayProps }\n          v-model={ isActive.value }\n          absolute\n          activatorProps={ activatorProps.value }\n          onClick:outside={ onClickOutside }\n          { ...scopeId }\n        >\n          {{\n            activator: slots.activator,\n            default: (...args) => (\n              <VDefaultsProvider root>\n                { slots.default?.(...args) }\n              </VDefaultsProvider>\n            ),\n          }}\n        </VOverlay>\n      )\n    })\n\n    return forwardRefs({ id }, overlay)\n  },\n})\n\nexport type VMenu = InstanceType<typeof VMenu>\n"],"mappings":"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"}

package/lib/components/VMenu/index.d.ts

@@ -1,5 +1,5 @@
 import * as vue from 'vue';
-import { Ref, VNodeChild } from 'vue';
+import { Ref, EffectScope, VNodeChild } from 'vue';
 
 interface ScrollStrategyData {
     root: Ref<HTMLElement | undefined>;
@@ -8,7 +8,7 @@ interface ScrollStrategyData {
     isActive: Ref<boolean>;
     updateLocation: Ref<((e: Event) => void) | undefined>;
 }
-declare type ScrollStrategyFn = (data: ScrollStrategyData, props: StrategyProps$1) => void;
+declare type ScrollStrategyFn = (data: ScrollStrategyData, props: StrategyProps$1, scope: EffectScope) => void;
 declare const scrollStrategies: {
     none: null;
     close: typeof closeScrollStrategy;
@@ -21,7 +21,24 @@ interface StrategyProps$1 {
 }
 declare function closeScrollStrategy(data: ScrollStrategyData): void;
 declare function blockScrollStrategy(data: ScrollStrategyData, props: StrategyProps$1): void;
-declare function repositionScrollStrategy(data: ScrollStrategyData): void;
+declare function repositionScrollStrategy(data: ScrollStrategyData, props: StrategyProps$1, scope: EffectScope): void;
+
+declare class Box {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    constructor({ x, y, width, height }: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    });
+    get top(): number;
+    get bottom(): number;
+    get left(): number;
+    get right(): number;
+}
 
 declare const block: readonly ["top", "bottom"];
 declare const inline: readonly ["start", "end", "left", "right"];
@@ -69,7 +86,13 @@ interface StrategyProps {
 }
 declare function staticLocationStrategy(): void;
 declare function connectedLocationStrategy(data: LocationStrategyData, props: StrategyProps, contentStyles: Ref<Record<string, string>>): {
-    updateLocation: () => void;
+    updateLocation: () => {
+        available: {
+            x: number;
+            y: number;
+        };
+        contentBox: Box;
+    } | undefined;
 };
 
 declare type OverlaySlots = MakeSlots<{
@@ -112,7 +135,7 @@ declare const VMenu: {
             locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
                 updateLocation: (e: Event) => void;
             } | undefined);
-            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
             closeOnBack: boolean;
             contained: boolean;
             noClickAnimation: boolean;
@@ -210,12 +233,12 @@ declare const VMenu: {
                 } | undefined);
             };
             scrollStrategy: Omit<{
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                 default: string;
                 validator: (val: any) => boolean;
             }, "type" | "default"> & {
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
-                default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
+                default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
             };
             closeOnBack: {
                 type: BooleanConstructor;
@@ -342,12 +365,12 @@ declare const VMenu: {
                 } | undefined);
             };
             scrollStrategy: Omit<{
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                 default: string;
                 validator: (val: any) => boolean;
             }, "type" | "default"> & {
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
-                default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
+                default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
             };
             closeOnBack: {
                 type: BooleanConstructor;
@@ -392,7 +415,7 @@ declare const VMenu: {
                 locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
                     updateLocation: (e: Event) => void;
                 } | undefined);
-                scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+                scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
                 closeOnBack: boolean;
                 contained: boolean;
                 noClickAnimation: boolean;
@@ -409,7 +432,7 @@ declare const VMenu: {
                 };
                 theme: StringConstructor;
                 scrollStrategy: {
-                    type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                    type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                     default: string;
                     validator: (val: any) => boolean;
                 };
@@ -503,7 +526,7 @@ declare const VMenu: {
                 };
                 theme: StringConstructor;
                 scrollStrategy: {
-                    type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                    type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                     default: string;
                     validator: (val: any) => boolean;
                 };
@@ -603,7 +626,7 @@ declare const VMenu: {
                 locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
                     updateLocation: (e: Event) => void;
                 } | undefined);
-                scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+                scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
                 closeOnBack: boolean;
                 contained: boolean;
                 noClickAnimation: boolean;
@@ -640,7 +663,7 @@ declare const VMenu: {
             };
             theme: StringConstructor;
             scrollStrategy: {
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                 default: string;
                 validator: (val: any) => boolean;
             };
@@ -774,7 +797,7 @@ declare const VMenu: {
             locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
                 updateLocation: (e: Event) => void;
             } | undefined);
-            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
             closeOnBack: boolean;
             contained: boolean;
             noClickAnimation: boolean;
@@ -892,12 +915,12 @@ declare const VMenu: {
             } | undefined);
         };
         scrollStrategy: Omit<{
-            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
             default: string;
             validator: (val: any) => boolean;
         }, "type" | "default"> & {
-            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
-            default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
+            default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
         };
         closeOnBack: {
             type: BooleanConstructor;
@@ -942,7 +965,7 @@ declare const VMenu: {
             locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
                 updateLocation: (e: Event) => void;
             } | undefined);
-            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
             closeOnBack: boolean;
             contained: boolean;
             noClickAnimation: boolean;
@@ -959,7 +982,7 @@ declare const VMenu: {
             };
             theme: StringConstructor;
             scrollStrategy: {
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                 default: string;
                 validator: (val: any) => boolean;
             };
@@ -1053,7 +1076,7 @@ declare const VMenu: {
             };
             theme: StringConstructor;
             scrollStrategy: {
-                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+                type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
                 default: string;
                 validator: (val: any) => boolean;
             };
@@ -1153,7 +1176,7 @@ declare const VMenu: {
             locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
                 updateLocation: (e: Event) => void;
             } | undefined);
-            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+            scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
             closeOnBack: boolean;
             contained: boolean;
             noClickAnimation: boolean;
@@ -1190,7 +1213,7 @@ declare const VMenu: {
         };
         theme: StringConstructor;
         scrollStrategy: {
-            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
             default: string;
             validator: (val: any) => boolean;
         };
@@ -1392,12 +1415,12 @@ declare const VMenu: {
         } | undefined);
     };
     scrollStrategy: Omit<{
-        type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+        type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
         default: string;
         validator: (val: any) => boolean;
     }, "type" | "default"> & {
-        type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
-        default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+        type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
+        default: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
     };
     closeOnBack: {
         type: BooleanConstructor;
@@ -1442,7 +1465,7 @@ declare const VMenu: {
         locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
             updateLocation: (e: Event) => void;
         } | undefined);
-        scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+        scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
         closeOnBack: boolean;
         contained: boolean;
         noClickAnimation: boolean;
@@ -1459,7 +1482,7 @@ declare const VMenu: {
         };
         theme: StringConstructor;
         scrollStrategy: {
-            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
             default: string;
             validator: (val: any) => boolean;
         };
@@ -1553,7 +1576,7 @@ declare const VMenu: {
         };
         theme: StringConstructor;
         scrollStrategy: {
-            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+            type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
             default: string;
             validator: (val: any) => boolean;
         };
@@ -1653,7 +1676,7 @@ declare const VMenu: {
         locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
             updateLocation: (e: Event) => void;
         } | undefined);
-        scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+        scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
         closeOnBack: boolean;
         contained: boolean;
         noClickAnimation: boolean;
@@ -1690,7 +1713,7 @@ declare const VMenu: {
     };
     theme: StringConstructor;
     scrollStrategy: {
-        type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition">;
+        type: vue.PropType<"none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition">;
         default: string;
         validator: (val: any) => boolean;
     };
@@ -1824,7 +1847,7 @@ declare const VMenu: {
     locationStrategy: "connected" | "static" | ((data: LocationStrategyData, props: StrategyProps, contentStyles: vue.Ref<Record<string, string>>) => {
         updateLocation: (e: Event) => void;
     } | undefined);
-    scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1) => void) | "reposition";
+    scrollStrategy: "none" | "block" | "close" | ((data: ScrollStrategyData, props: StrategyProps$1, scope: vue.EffectScope) => void) | "reposition";
     closeOnBack: boolean;
     contained: boolean;
     noClickAnimation: boolean;

package/lib/components/VNavigationDrawer/VNavigationDrawer.css

@@ -25,6 +25,10 @@
 .v-navigation-drawer--rounded {
   border-radius: 4px;
 }
+.v-navigation-drawer--top {
+  top: 0;
+  border-bottom-width: thin;
+}
 .v-navigation-drawer--bottom {
   left: 0;
   border-top-width: thin;

package/lib/components/VNavigationDrawer/VNavigationDrawer.mjs

@@ -20,7 +20,7 @@ import { useSticky } from "./sticky.mjs";
 import { useTouch } from "./touch.mjs"; // Utilities
 import { computed, nextTick, onBeforeMount, ref, toRef, Transition, watch } from 'vue';
 import { convertToUnit, defineComponent, toPhysical, useRender } from "../../util/index.mjs"; // Types
-const locations = ['start', 'end', 'left', 'right', 'bottom'];
+const locations = ['start', 'end', 'left', 'right', 'top', 'bottom'];
 export const VNavigationDrawer = defineComponent({
   name: 'VNavigationDrawer',
   props: {