@vuetify/nightly 3.0.0-beta.3 → 3.0.0-beta.6

package/lib/components/VList/VListItem.mjs

@@ -1,14 +1,17 @@
-import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
 // Styles
 import "./VListItem.css"; // Components
 
-import { VListItemAvatar } from "./VListItemAvatar.mjs";
-import { VListItemHeader } from "./VListItemHeader.mjs";
-import { VListItemIcon } from "./VListItemIcon.mjs";
+import { VAvatar } from "../VAvatar/index.mjs";
+import { VDefaultsProvider } from "../VDefaultsProvider/index.mjs";
+import { VIcon } from "../VIcon/index.mjs";
 import { VListItemSubtitle } from "./VListItemSubtitle.mjs";
-import { VListItemTitle } from "./VListItemTitle.mjs"; // Composables
+import { VListItemTitle } from "./VListItemTitle.mjs"; // Directives
+
+import { Ripple } from "../../directives/ripple/index.mjs"; // Composables
 
 import { genOverlays, makeVariantProps, useVariant } from "../../composables/variant.mjs";
+import { IconValue } from "../../composables/icons.mjs";
 import { makeBorderProps, useBorder } from "../../composables/border.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs";
@@ -18,13 +21,10 @@ import { makeRouterProps, useLink } from "../../composables/router.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { useList } from "./list.mjs";
-import { IconValue } from "../../composables/icons.mjs"; // Directives
-
-import { Ripple } from "../../directives/ripple/index.mjs"; // Utilities
+import { useNestedItem } from "../../composables/nested/nested.mjs"; // Utilities
 
-import { computed, onMounted, watch } from 'vue';
-import { genericComponent, useRender } from "../../util/index.mjs";
-import { useNestedItem } from "../../composables/nested/nested.mjs"; // Types
+import { computed, watch } from 'vue';
+import { genericComponent, useRender } from "../../util/index.mjs"; // Types
 
 export const VListItem = genericComponent()({
   name: 'VListItem',
@@ -93,21 +93,16 @@ export const VListItem = genericComponent()({
         variant: props.variant
       };
     });
-    onMounted(() => {
-      var _link$isExactActive2;
-
-      if ((_link$isExactActive2 = link.isExactActive) != null && _link$isExactActive2.value && parent.value != null) {
-        root.open(parent.value, true);
-      }
-    });
     watch(() => {
-      var _link$isExactActive3;
+      var _link$isExactActive2;
 
-      return (_link$isExactActive3 = link.isExactActive) == null ? void 0 : _link$isExactActive3.value;
+      return (_link$isExactActive2 = link.isExactActive) == null ? void 0 : _link$isExactActive2.value;
     }, val => {
       if (val && parent.value != null) {
         root.open(parent.value, true);
       }
+    }, {
+      immediate: true
     });
     const {
       themeClasses
@@ -140,13 +135,12 @@ export const VListItem = genericComponent()({
       isIndeterminate: isIndeterminate.value
     }));
     useRender(() => {
-      var _slots$prepend, _slots$default, _slots$append;
+      var _slots$prepend, _slots$title, _slots$title2, _slots$subtitle, _slots$subtitle2, _slots$default, _slots$append;
 
       const Tag = link.isLink.value ? 'a' : props.tag;
       const hasColor = !list || isSelected.value || isActive.value;
       const hasTitle = slots.title || props.title;
       const hasSubtitle = slots.subtitle || props.subtitle;
-      const hasHeader = !!(hasTitle || hasSubtitle);
       const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon);
       const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon);
       const isClickable = !props.disabled && (props.link || link.isClickable.value || props.value != null && !!list);
@@ -171,31 +165,70 @@ export const VListItem = genericComponent()({
           props.value != null && select(!isSelected.value, e);
         })
       }, {
-        default: () => [genOverlays(isClickable || isActive.value, 'v-list-item'), hasPrepend && _createVNode(_Fragment, null, [props.prependAvatar && _createVNode(VListItemAvatar, {
-          "image": props.prependAvatar,
-          "start": true
-        }, null), props.prependIcon && _createVNode(VListItemIcon, {
-          "icon": props.prependIcon,
-          "start": true
-        }, null), (_slots$prepend = slots.prepend) == null ? void 0 : _slots$prepend.call(slots, slotProps.value)]), hasHeader && _createVNode(VListItemHeader, null, {
-          default: () => [hasTitle && _createVNode(VListItemTitle, null, {
-            default: () => [slots.title ? slots.title({
-              title: props.title
-            }) : props.title]
-          }), hasSubtitle && _createVNode(VListItemSubtitle, null, {
-            default: () => [slots.subtitle ? slots.subtitle({
-              subtitle: props.subtitle
-            }) : props.subtitle]
-          })]
-        }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, slotProps.value), hasAppend && _createVNode(_Fragment, null, [(_slots$append = slots.append) == null ? void 0 : _slots$append.call(slots, slotProps.value), props.appendAvatar && _createVNode(VListItemAvatar, {
-          "image": props.appendAvatar,
-          "end": true
-        }, null), props.appendIcon && _createVNode(VListItemIcon, {
-          "icon": props.appendIcon,
-          "end": true
-        }, null)])]
+        default: () => [genOverlays(isClickable || isActive.value, 'v-list-item'), hasPrepend && _createVNode(VDefaultsProvider, {
+          "key": "prepend",
+          "defaults": {
+            VAvatar: {
+              density: props.density,
+              image: props.prependAvatar
+            },
+            VIcon: {
+              density: props.density,
+              icon: props.prependIcon
+            },
+            VListItemAction: {
+              start: true
+            }
+          }
+        }, {
+          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", {
+          "class": "v-list-item__content"
+        }, [hasTitle && _createVNode(VListItemTitle, {
+          "key": "title"
+        }, {
+          default: () => [(_slots$title = (_slots$title2 = slots.title) == null ? void 0 : _slots$title2.call(slots, {
+            title: props.title
+          })) != null ? _slots$title : props.title]
+        }), hasSubtitle && _createVNode(VListItemSubtitle, {
+          "key": "subtitle"
+        }, {
+          default: () => [(_slots$subtitle = (_slots$subtitle2 = slots.subtitle) == null ? void 0 : _slots$subtitle2.call(slots, {
+            subtitle: props.subtitle
+          })) != null ? _slots$subtitle : props.subtitle]
+        }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, slotProps.value)]), hasAppend && _createVNode(VDefaultsProvider, {
+          "key": "append",
+          "defaults": {
+            VAvatar: {
+              density: props.density,
+              image: props.appendAvatar
+            },
+            VIcon: {
+              density: props.density,
+              icon: props.appendIcon
+            },
+            VListItemAction: {
+              end: true
+            }
+          }
+        }, {
+          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)])]
+        })]
       }), [[_resolveDirective("ripple"), isClickable]]);
     });
+    return {};
   }
 
 });

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

@@ -1 +1 @@
-{"version":3,"file":"VListItem.mjs","names":["VListItemAvatar","VListItemHeader","VListItemIcon","VListItemSubtitle","VListItemTitle","genOverlays","makeVariantProps","useVariant","makeBorderProps","useBorder","makeDensityProps","useDensity","makeDimensionProps","useDimension","makeElevationProps","useElevation","makeRoundedProps","useRounded","makeRouterProps","useLink","makeTagProps","makeThemeProps","provideTheme","useList","IconValue","Ripple","computed","onMounted","watch","genericComponent","useRender","useNestedItem","VListItem","name","directives","props","active","Boolean","activeColor","String","activeClass","appendAvatar","appendIcon","disabled","lines","nav","prependAvatar","prependIcon","subtitle","Number","title","value","link","variant","setup","attrs","slots","id","href","select","isSelected","isIndeterminate","isGroupActivator","root","parent","list","isActive","isExactActive","roundedProps","rounded","variantProps","color","open","val","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","roundedClasses","lineClasses","undefined","slotProps","Tag","isLink","tag","hasColor","hasTitle","hasSubtitle","hasHeader","hasAppend","append","hasPrepend","prepend","isClickable","updateHasPrepend","e","navigate","default"],"sources":["../../../src/components/VList/VListItem.tsx"],"sourcesContent":["// Styles\nimport './VListItem.sass'\n\n// Components\nimport { VListItemAvatar } from './VListItemAvatar'\nimport { VListItemHeader } from './VListItemHeader'\nimport { VListItemIcon } from './VListItemIcon'\nimport { VListItemSubtitle } from './VListItemSubtitle'\nimport { VListItemTitle } from './VListItemTitle'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\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 { IconValue } from '@/composables/icons'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { computed, onMounted, watch } from 'vue'\nimport { genericComponent, useRender } from '@/util'\nimport { useNestedItem } from '@/composables/nested/nested'\n\n// Types\nimport type { MakeSlots } 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  $slots: MakeSlots<{\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: Boolean,\n    activeColor: String,\n    activeClass: String,\n    appendAvatar: String,\n    appendIcon: IconValue,\n    disabled: Boolean,\n    lines: String as PropType<'one' | 'two' | 'three'>,\n    nav: Boolean,\n    prependAvatar: String,\n    prependIcon: IconValue,\n    subtitle: [String, Number, Boolean],\n    title: [String, Number, Boolean],\n    value: null,\n    link: Boolean,\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  setup (props, { attrs, slots }) {\n    const link = useLink(props, attrs)\n    const id = computed(() => props.value ?? link.href.value)\n    const { select, isSelected, isIndeterminate, isGroupActivator, root, parent } = useNestedItem(id, false)\n    const list = useList()\n    const isActive = computed(() => {\n      return props.active || link.isExactActive?.value || isSelected.value\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    onMounted(() => {\n      if (link.isExactActive?.value && parent.value != null) {\n        root.open(parent.value, true)\n      }\n    })\n\n    watch(() => link.isExactActive?.value, val => {\n      if (val && parent.value != null) {\n        root.open(parent.value, true)\n      }\n    })\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    useRender(() => {\n      const Tag = (link.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 hasHeader = !!(hasTitle || hasSubtitle)\n      const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon)\n      const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon)\n      const isClickable = !props.disabled && (props.link || link.isClickable.value || (props.value != null && !!list))\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,\n              'v-list-item--nav': props.nav,\n              'v-list-item--prepend': !hasPrepend && list?.hasPrepend.value,\n              [`${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 ? 0 : undefined }\n          onClick={ isClickable && ((e: MouseEvent) => {\n            if (isGroupActivator) return\n\n            link.navigate?.(e)\n            props.value != null && select(!isSelected.value, e)\n          })}\n          v-ripple={ isClickable }\n        >\n          { genOverlays(isClickable || isActive.value, 'v-list-item') }\n\n          { hasPrepend && (\n            <>\n              { props.prependAvatar && (\n                <VListItemAvatar\n                  image={ props.prependAvatar }\n                  start\n                />\n              ) }\n\n              { props.prependIcon && (\n                <VListItemIcon\n                  icon={ props.prependIcon }\n                  start\n                />\n              ) }\n\n              { slots.prepend?.(slotProps.value) }\n            </>\n          ) }\n\n          { hasHeader && (\n            <VListItemHeader>\n              { hasTitle && (\n                <VListItemTitle>\n                  { slots.title\n                    ? slots.title({ title: props.title })\n                    : props.title\n                  }\n                </VListItemTitle>\n              ) }\n\n              { hasSubtitle && (\n                <VListItemSubtitle>\n                  { slots.subtitle\n                    ? slots.subtitle({ subtitle: props.subtitle })\n                    : props.subtitle\n                  }\n                </VListItemSubtitle>\n              ) }\n            </VListItemHeader>\n          ) }\n\n          { slots.default?.(slotProps.value) }\n\n          { hasAppend && (\n            <>\n              { slots.append?.(slotProps.value) }\n\n              { props.appendAvatar && (\n                <VListItemAvatar\n                  image={ props.appendAvatar }\n                  end\n                />\n              ) }\n\n              { props.appendIcon && (\n                <VListItemIcon\n                  icon={ props.appendIcon }\n                  end\n                />\n              ) }\n            </>\n          ) }\n        </Tag>\n      )\n    })\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","genericComponent","useRender","VListItem","name","directives","props","active","Boolean","activeColor","String","activeClass","appendAvatar","appendIcon","disabled","lines","nav","prependAvatar","prependIcon","subtitle","Number","title","value","link","variant","setup","attrs","slots","id","href","select","isSelected","isIndeterminate","isGroupActivator","root","parent","list","isActive","isExactActive","roundedProps","rounded","variantProps","color","val","open","immediate","themeClasses","borderClasses","colorClasses","colorStyles","variantClasses","densityClasses","dimensionStyles","elevationClasses","roundedClasses","lineClasses","undefined","slotProps","Tag","isLink","tag","hasColor","hasTitle","hasSubtitle","hasAppend","append","hasPrepend","prepend","isClickable","updateHasPrepend","e","navigate","density","image","icon","VListItemAction","start","default","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 { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { MakeSlots } 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  $slots: MakeSlots<{\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: Boolean,\n    activeColor: String,\n    activeClass: String,\n    appendAvatar: String,\n    appendIcon: IconValue,\n    disabled: Boolean,\n    lines: String as PropType<'one' | 'two' | 'three'>,\n    nav: Boolean,\n    prependAvatar: String,\n    prependIcon: IconValue,\n    subtitle: [String, Number, Boolean],\n    title: [String, Number, Boolean],\n    value: null,\n    link: Boolean,\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  setup (props, { attrs, slots }) {\n    const link = useLink(props, attrs)\n    const id = computed(() => props.value ?? link.href.value)\n    const { select, isSelected, isIndeterminate, isGroupActivator, root, parent } = useNestedItem(id, false)\n    const list = useList()\n    const isActive = computed(() => {\n      return props.active || link.isExactActive?.value || isSelected.value\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.isExactActive?.value, val => {\n      if (val && parent.value != null) {\n        root.open(parent.value, true)\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    useRender(() => {\n      const Tag = (link.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      const isClickable = !props.disabled && (props.link || link.isClickable.value || (props.value != null && !!list))\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,\n              'v-list-item--nav': props.nav,\n              'v-list-item--prepend': !hasPrepend && list?.hasPrepend.value,\n              [`${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 ? 0 : undefined }\n          onClick={ isClickable && ((e: MouseEvent) => {\n            if (isGroupActivator) return\n\n            link.navigate?.(e)\n            props.value != null && select(!isSelected.value, e)\n          })}\n          v-ripple={ isClickable }\n        >\n          { genOverlays(isClickable || 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\">\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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"}

package/lib/components/VList/VListItem.sass

@@ -1,22 +1,34 @@
-@forward './variables'
 @use 'sass:list'
 @use '../../styles/tools'
 @use './variables' as *
 
 .v-list-item
   align-items: center
-  display: flex
+  display: grid
+  flex: none
+  grid-template-areas: "prepend content append"
+  grid-template-columns: max-content auto max-content
+  outline: none
   padding: $list-item-padding
   position: relative
-  outline: none
   text-decoration: none
-  transition: $list-item-transition
 
   @include tools.border($list-item-border...)
   @include tools.states('.v-list-item__overlay')
   @include tools.rounded($list-item-border-radius)
   @include tools.variant($list-item-variants...)
 
+  &__prepend,
+  &__append
+    > .v-icon
+      opacity: #{$list-item-icon-opacity}
+
+  &--active
+    .v-list-item__prepend,
+    .v-list-item__append
+      > .v-icon
+        opacity: #{$list-item-icon-active-opacity}
+
   &--rounded
     @include tools.rounded($list-item-rounded-border-radius)
 
@@ -28,41 +40,52 @@
   &--link
     cursor: pointer
 
-.v-list-item-action,
-.v-list-item-avatar,
-.v-list-item-icon
+.v-list-item__prepend
+  align-items: center
   align-self: center
   display: flex
-  align-items: center
-  flex: none
-  transition: inherit
-  transition-property: height, width
+  grid-area: prepend
 
-  .v-list-item--three-line &
-    align-self: flex-start
+  > .v-avatar
+    margin-inline-end: $list-item-avatar-margin-end
 
-.v-list-item-avatar
-  $root: &
+  > .v-icon
+    margin-inline-end: $list-item-icon-margin-end
 
-  &--start
-    margin-inline-end: $list-item-avatar-margin-end
+  .v-list-item--two-line &,
+  .v-list-item--three-line &
+    align-self: start
 
-  &--end
+.v-list-item__append
+  align-self: center
+  display: flex
+  align-items: center
+  grid-area: append
+
+  > .v-avatar
     margin-inline-start: $list-item-avatar-margin-start
 
-  @at-root
-    @include tools.density('v-list-item', $list-density) using ($modifier)
-      &.v-list-item--three-line #{$root}
-        margin-top: $list-item-avatar-margin-y - $modifier
+  > .v-icon
+    margin-inline-start: $list-item-icon-margin-start
 
-.v-list-item-icon
-  &--start
-    margin-inline-end: $list-item-icon-margin-end
+  .v-list-item--two-line &,
+  .v-list-item--three-line &
+    align-self: start
 
-  &--end
-    margin-inline-start: $list-item-icon-margin-start
+.v-list-item__content
+  align-self: center
+  grid-area: content
+  overflow: hidden
 
 .v-list-item-action
+  align-self: center
+  display: flex
+  align-items: center
+  grid-area: prepend
+  flex: none
+  transition: inherit
+  transition-property: height, width
+
   &--start
     margin-inline-end: $list-item-action-margin-start
 
@@ -87,10 +110,6 @@
     margin-top: $list-item-media-three-line-margin-top
     margin-bottom: $list-item-media-three-line-margin-bottom
 
-.v-list-item-header
-  flex: 1 1 auto
-  min-width: 0
-
 .v-list-item-subtitle
   -webkit-box-orient: vertical
   display: -webkit-box
@@ -131,10 +150,12 @@
 .v-list-item
   @at-root
     @include tools.density('v-list-item', $list-density) using ($modifier)
+      min-height: $list-item-min-height + $modifier
+
       &.v-list-item--one-line
         $one-line-padding: (list.nth($list-item-padding, 1) + $modifier)
 
-        min-height: $list-item-min-height + $modifier
+        min-height: $list-item-one-line-min-height + $modifier
         padding-top: $one-line-padding
         padding-bottom: $one-line-padding
 
@@ -173,6 +194,9 @@
       &:not(:last-child):not(:only-child)
         margin-bottom: $list-item-nav-margin-top
 
+.v-list-item__underlay
+  position: absolute
+
 .v-list-item__overlay
   background-color: currentColor
   border-radius: inherit
@@ -185,7 +209,7 @@
   top: 0
   transition: opacity 0.2s ease-in-out
 
-  .v-list-item--active.v-list-item--contained &
+  .v-list-item--active.v-list-item--variant-elevated &
     --v-theme-overlay-multiplier: 0
 
 $base-padding: list.nth($list-item-padding, 2)
@@ -196,21 +220,25 @@ $base-padding: list.nth($list-item-padding, 2)
     --indent-padding: -#{$list-nav-padding}
 
 .v-list-group
+  --list-indent-size: #{$list-indent-size}
   --parent-padding: var(--indent-padding)
+  --prepend-width: #{$list-item-prepend-size}
+
+  &--fluid
+    --list-indent-size: 0px
+
   &--prepend
-    --parent-padding: calc(var(--indent-padding) + #{$list-item-avatar-size})
+    --parent-padding: calc(var(--indent-padding) + var(--prepend-width))
+
+  &--fluid.v-list-group--prepend
+    --parent-padding: var(--indent-padding)
 
 .v-list-group__items
-  --indent-padding: calc(var(--parent-padding) + #{$list-indent-size})
+  --indent-padding: calc(var(--parent-padding) + var(--list-indent-size))
 
 .v-list-group__items .v-list-item
   padding-inline-start: calc(#{$base-padding} + var(--indent-padding)) !important
 
-.v-list-item--prepend,
-.v-list-group__items .v-list-item--prepend
-  .v-list-item-avatar
-    padding-inline-start: calc(#{$base-padding} + var(--indent-padding) + #{$list-item-avatar-size} + #{$list-item-avatar-margin-start}) !important
-
 .v-list-group__header.v-list-item--active
   .v-list-item__overlay
     display: none

package/lib/components/VList/VListItemAction.mjs

@@ -2,7 +2,7 @@ import { createVNode as _createVNode, resolveDirective as _resolveDirective } fr
 // Composables
 import { makeTagProps } from "../../composables/tag.mjs"; // Utilities
 
-import { defineComponent } from "../../util/index.mjs";
+import { defineComponent, useRender } from "../../util/index.mjs";
 export const VListItemAction = defineComponent({
   name: 'VListItemAction',
   props: {
@@ -15,14 +15,13 @@ export const VListItemAction = defineComponent({
     let {
       slots
     } = _ref;
-    return () => {
-      return _createVNode(props.tag, {
-        "class": ['v-list-item-action', {
-          'v-list-item-action--start': props.start,
-          'v-list-item-action--end': props.end
-        }]
-      }, slots);
-    };
+    useRender(() => _createVNode(props.tag, {
+      "class": ['v-list-item-action', {
+        'v-list-item-action--start': props.start,
+        'v-list-item-action--end': props.end
+      }]
+    }, slots));
+    return {};
   }
 
 });

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

@@ -1 +1 @@
-{"version":3,"file":"VListItemAction.mjs","names":["makeTagProps","defineComponent","VListItemAction","name","props","start","Boolean","end","setup","slots"],"sources":["../../../src/components/VList/VListItemAction.tsx"],"sourcesContent":["// Composables\nimport { makeTagProps } from '@/composables/tag'\n\n// Utilities\nimport { defineComponent } from '@/util'\n\nexport const VListItemAction = defineComponent({\n  name: 'VListItemAction',\n\n  props: {\n    start: Boolean,\n    end: Boolean,\n\n    ...makeTagProps(),\n  },\n\n  setup (props, { slots }) {\n    return () => {\n      return (\n        <props.tag\n          class={[\n            'v-list-item-action',\n            {\n              'v-list-item-action--start': props.start,\n              'v-list-item-action--end': props.end,\n            },\n          ]}\n          v-slots={ slots }\n        />\n      )\n    }\n  },\n})\n"],"mappings":";AAAA;SACSA,Y,qCAET;;SACSC,e;AAET,OAAO,MAAMC,eAAe,GAAGD,eAAe,CAAC;EAC7CE,IAAI,EAAE,iBADuC;EAG7CC,KAAK,EAAE;IACLC,KAAK,EAAEC,OADF;IAELC,GAAG,EAAED,OAFA;IAIL,GAAGN,YAAY;EAJV,CAHsC;;EAU7CQ,KAAK,CAAEJ,KAAF,QAAoB;IAAA,IAAX;MAAEK;IAAF,CAAW;IACvB,OAAO,MAAM;MACX;QAAA,SAEW,CACL,oBADK,EAEL;UACE,6BAA6BL,KAAK,CAACC,KADrC;UAEE,2BAA2BD,KAAK,CAACG;QAFnC,CAFK;MAFX,GAScE,KATd;IAYD,CAbD;EAcD;;AAzB4C,CAAD,CAAvC"}
+{"version":3,"file":"VListItemAction.mjs","names":["makeTagProps","defineComponent","useRender","VListItemAction","name","props","start","Boolean","end","setup","slots"],"sources":["../../../src/components/VList/VListItemAction.tsx"],"sourcesContent":["// Composables\nimport { makeTagProps } from '@/composables/tag'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\n\nexport const VListItemAction = defineComponent({\n  name: 'VListItemAction',\n\n  props: {\n    start: Boolean,\n    end: Boolean,\n\n    ...makeTagProps(),\n  },\n\n  setup (props, { slots }) {\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-list-item-action',\n          {\n            'v-list-item-action--start': props.start,\n            'v-list-item-action--end': props.end,\n          },\n        ]}\n        v-slots={ slots }\n      />\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;SACSA,Y,qCAET;;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,eAAe,GAAGF,eAAe,CAAC;EAC7CG,IAAI,EAAE,iBADuC;EAG7CC,KAAK,EAAE;IACLC,KAAK,EAAEC,OADF;IAELC,GAAG,EAAED,OAFA;IAIL,GAAGP,YAAY;EAJV,CAHsC;;EAU7CS,KAAK,CAAEJ,KAAF,QAAoB;IAAA,IAAX;MAAEK;IAAF,CAAW;IACvBR,SAAS,CAAC;MAAA,SAEC,CACL,oBADK,EAEL;QACE,6BAA6BG,KAAK,CAACC,KADrC;QAEE,2BAA2BD,KAAK,CAACG;MAFnC,CAFK;IAFD,GASIE,KATJ,CAAD,CAAT;IAaA,OAAO,EAAP;EACD;;AAzB4C,CAAD,CAAvC"}

package/lib/components/VList/VListItemMedia.mjs

@@ -2,7 +2,7 @@ import { createVNode as _createVNode, resolveDirective as _resolveDirective } fr
 // Composables
 import { makeTagProps } from "../../composables/tag.mjs"; // Utilities
 
-import { defineComponent } from "../../util/index.mjs";
+import { defineComponent, useRender } from "../../util/index.mjs";
 export const VListItemMedia = defineComponent({
   name: 'VListItemMedia',
   props: {
@@ -15,14 +15,15 @@ export const VListItemMedia = defineComponent({
     let {
       slots
     } = _ref;
-    return () => {
+    useRender(() => {
       return _createVNode(props.tag, {
         "class": ['v-list-item-media', {
           'v-list-item-media--start': props.start,
           'v-list-item-media--end': props.end
         }]
       }, slots);
-    };
+    });
+    return {};
   }
 
 });

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

@@ -1 +1 @@
-{"version":3,"file":"VListItemMedia.mjs","names":["makeTagProps","defineComponent","VListItemMedia","name","props","start","Boolean","end","setup","slots"],"sources":["../../../src/components/VList/VListItemMedia.tsx"],"sourcesContent":["// Composables\nimport { makeTagProps } from '@/composables/tag'\n\n// Utilities\nimport { defineComponent } from '@/util'\n\nexport const VListItemMedia = defineComponent({\n  name: 'VListItemMedia',\n\n  props: {\n    start: Boolean,\n    end: Boolean,\n\n    ...makeTagProps(),\n  },\n\n  setup (props, { slots }) {\n    return () => {\n      return (\n        <props.tag\n          class={[\n            'v-list-item-media',\n            {\n              'v-list-item-media--start': props.start,\n              'v-list-item-media--end': props.end,\n            },\n          ]}\n          v-slots={ slots }\n        />\n      )\n    }\n  },\n})\n"],"mappings":";AAAA;SACSA,Y,qCAET;;SACSC,e;AAET,OAAO,MAAMC,cAAc,GAAGD,eAAe,CAAC;EAC5CE,IAAI,EAAE,gBADsC;EAG5CC,KAAK,EAAE;IACLC,KAAK,EAAEC,OADF;IAELC,GAAG,EAAED,OAFA;IAIL,GAAGN,YAAY;EAJV,CAHqC;;EAU5CQ,KAAK,CAAEJ,KAAF,QAAoB;IAAA,IAAX;MAAEK;IAAF,CAAW;IACvB,OAAO,MAAM;MACX;QAAA,SAEW,CACL,mBADK,EAEL;UACE,4BAA4BL,KAAK,CAACC,KADpC;UAEE,0BAA0BD,KAAK,CAACG;QAFlC,CAFK;MAFX,GAScE,KATd;IAYD,CAbD;EAcD;;AAzB2C,CAAD,CAAtC"}
+{"version":3,"file":"VListItemMedia.mjs","names":["makeTagProps","defineComponent","useRender","VListItemMedia","name","props","start","Boolean","end","setup","slots"],"sources":["../../../src/components/VList/VListItemMedia.tsx"],"sourcesContent":["// Composables\nimport { makeTagProps } from '@/composables/tag'\n\n// Utilities\nimport { defineComponent, useRender } from '@/util'\n\nexport const VListItemMedia = defineComponent({\n  name: 'VListItemMedia',\n\n  props: {\n    start: Boolean,\n    end: Boolean,\n\n    ...makeTagProps(),\n  },\n\n  setup (props, { slots }) {\n    useRender(() => {\n      return (\n        <props.tag\n          class={[\n            'v-list-item-media',\n            {\n              'v-list-item-media--start': props.start,\n              'v-list-item-media--end': props.end,\n            },\n          ]}\n          v-slots={ slots }\n        />\n      )\n    })\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;SACSA,Y,qCAET;;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,cAAc,GAAGF,eAAe,CAAC;EAC5CG,IAAI,EAAE,gBADsC;EAG5CC,KAAK,EAAE;IACLC,KAAK,EAAEC,OADF;IAELC,GAAG,EAAED,OAFA;IAIL,GAAGP,YAAY;EAJV,CAHqC;;EAU5CS,KAAK,CAAEJ,KAAF,QAAoB;IAAA,IAAX;MAAEK;IAAF,CAAW;IACvBR,SAAS,CAAC,MAAM;MACd;QAAA,SAEW,CACL,mBADK,EAEL;UACE,4BAA4BG,KAAK,CAACC,KADpC;UAEE,0BAA0BD,KAAK,CAACG;QAFlC,CAFK;MAFX,GAScE,KATd;IAYD,CAbQ,CAAT;IAeA,OAAO,EAAP;EACD;;AA3B2C,CAAD,CAAtC"}

package/lib/components/VList/VListSubheader.mjs

@@ -4,7 +4,7 @@ import { makeTagProps } from "../../composables/tag.mjs";
 import { useTextColor } from "../../composables/color.mjs"; // Utilities
 
 import { toRef } from 'vue';
-import { defineComponent } from "../../util/index.mjs";
+import { defineComponent, useRender } from "../../util/index.mjs";
 export const VListSubheader = defineComponent({
   name: 'VListSubheader',
   props: {
@@ -23,7 +23,7 @@ export const VListSubheader = defineComponent({
       textColorClasses,
       textColorStyles
     } = useTextColor(toRef(props, 'color'));
-    return () => {
+    useRender(() => {
       var _slots$default, _slots$default2;
 
       const hasText = !!(slots.default || props.title);
@@ -40,7 +40,8 @@ export const VListSubheader = defineComponent({
           "class": "v-list-subheader__text"
         }, [(_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)) != null ? _slots$default : props.title])]
       });
-    };
+    });
+    return {};
   }
 
 });

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

@@ -1 +1 @@
-{"version":3,"file":"VListSubheader.mjs","names":["makeTagProps","useTextColor","toRef","defineComponent","VListSubheader","name","props","color","String","inset","Boolean","sticky","title","setup","slots","textColorClasses","textColorStyles","hasText","default","value"],"sources":["../../../src/components/VList/VListSubheader.tsx"],"sourcesContent":["// Composables\nimport { makeTagProps } from '@/composables/tag'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { defineComponent } from '@/util'\n\nexport const VListSubheader = defineComponent({\n  name: 'VListSubheader',\n\n  props: {\n    color: String,\n    inset: Boolean,\n    sticky: Boolean,\n    title: String,\n\n    ...makeTagProps(),\n  },\n\n  setup (props, { slots }) {\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'color'))\n\n    return () => {\n      const hasText = !!(slots.default || props.title)\n\n      return (\n        <props.tag\n          class={[\n            'v-list-subheader',\n            {\n              'v-list-subheader--inset': props.inset,\n              'v-list-subheader--sticky': props.sticky,\n            },\n            textColorClasses.value,\n          ]}\n          style={{ textColorStyles }}\n        >\n          { hasText && (\n            <div class=\"v-list-subheader__text\">\n              { slots.default?.() ?? props.title }\n            </div>\n          ) }\n        </props.tag>\n      )\n    }\n  },\n})\n"],"mappings":";AAAA;SACSA,Y;SACAC,Y,uCAET;;AACA,SAASC,KAAT,QAAsB,KAAtB;SACSC,e;AAET,OAAO,MAAMC,cAAc,GAAGD,eAAe,CAAC;EAC5CE,IAAI,EAAE,gBADsC;EAG5CC,KAAK,EAAE;IACLC,KAAK,EAAEC,MADF;IAELC,KAAK,EAAEC,OAFF;IAGLC,MAAM,EAAED,OAHH;IAILE,KAAK,EAAEJ,MAJF;IAML,GAAGR,YAAY;EANV,CAHqC;;EAY5Ca,KAAK,CAAEP,KAAF,QAAoB;IAAA,IAAX;MAAEQ;IAAF,CAAW;IACvB,MAAM;MAAEC,gBAAF;MAAoBC;IAApB,IAAwCf,YAAY,CAACC,KAAK,CAACI,KAAD,EAAQ,OAAR,CAAN,CAA1D;IAEA,OAAO,MAAM;MAAA;;MACX,MAAMW,OAAO,GAAG,CAAC,EAAEH,KAAK,CAACI,OAAN,IAAiBZ,KAAK,CAACM,KAAzB,CAAjB;MAEA;QAAA,SAEW,CACL,kBADK,EAEL;UACE,2BAA2BN,KAAK,CAACG,KADnC;UAEE,4BAA4BH,KAAK,CAACK;QAFpC,CAFK,EAMLI,gBAAgB,CAACI,KANZ,CAFX;QAAA,SAUW;UAAEH;QAAF;MAVX;QAAA,gBAYMC,OAAO;UAAA,SACI;QADJ,yCAEHH,KAAK,CAACI,OAFH,qBAEH,qBAAAJ,KAAK,CAFF,6BAEkBR,KAAK,CAACM,KAFxB,EAZb;MAAA;IAmBD,CAtBD;EAuBD;;AAtC2C,CAAD,CAAtC"}
+{"version":3,"file":"VListSubheader.mjs","names":["makeTagProps","useTextColor","toRef","defineComponent","useRender","VListSubheader","name","props","color","String","inset","Boolean","sticky","title","setup","slots","textColorClasses","textColorStyles","hasText","default","value"],"sources":["../../../src/components/VList/VListSubheader.tsx"],"sourcesContent":["// Composables\nimport { makeTagProps } from '@/composables/tag'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { toRef } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport const VListSubheader = defineComponent({\n  name: 'VListSubheader',\n\n  props: {\n    color: String,\n    inset: Boolean,\n    sticky: Boolean,\n    title: String,\n\n    ...makeTagProps(),\n  },\n\n  setup (props, { slots }) {\n    const { textColorClasses, textColorStyles } = useTextColor(toRef(props, 'color'))\n\n    useRender(() => {\n      const hasText = !!(slots.default || props.title)\n\n      return (\n        <props.tag\n          class={[\n            'v-list-subheader',\n            {\n              'v-list-subheader--inset': props.inset,\n              'v-list-subheader--sticky': props.sticky,\n            },\n            textColorClasses.value,\n          ]}\n          style={{ textColorStyles }}\n        >\n          { hasText && (\n            <div class=\"v-list-subheader__text\">\n              { slots.default?.() ?? props.title }\n            </div>\n          ) }\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;SACSA,Y;SACAC,Y,uCAET;;AACA,SAASC,KAAT,QAAsB,KAAtB;SACSC,e,EAAiBC,S;AAE1B,OAAO,MAAMC,cAAc,GAAGF,eAAe,CAAC;EAC5CG,IAAI,EAAE,gBADsC;EAG5CC,KAAK,EAAE;IACLC,KAAK,EAAEC,MADF;IAELC,KAAK,EAAEC,OAFF;IAGLC,MAAM,EAAED,OAHH;IAILE,KAAK,EAAEJ,MAJF;IAML,GAAGT,YAAY;EANV,CAHqC;;EAY5Cc,KAAK,CAAEP,KAAF,QAAoB;IAAA,IAAX;MAAEQ;IAAF,CAAW;IACvB,MAAM;MAAEC,gBAAF;MAAoBC;IAApB,IAAwChB,YAAY,CAACC,KAAK,CAACK,KAAD,EAAQ,OAAR,CAAN,CAA1D;IAEAH,SAAS,CAAC,MAAM;MAAA;;MACd,MAAMc,OAAO,GAAG,CAAC,EAAEH,KAAK,CAACI,OAAN,IAAiBZ,KAAK,CAACM,KAAzB,CAAjB;MAEA;QAAA,SAEW,CACL,kBADK,EAEL;UACE,2BAA2BN,KAAK,CAACG,KADnC;UAEE,4BAA4BH,KAAK,CAACK;QAFpC,CAFK,EAMLI,gBAAgB,CAACI,KANZ,CAFX;QAAA,SAUW;UAAEH;QAAF;MAVX;QAAA,gBAYMC,OAAO;UAAA,SACI;QADJ,yCAEHH,KAAK,CAACI,OAFH,qBAEH,qBAAAJ,KAAK,CAFF,6BAEkBR,KAAK,CAACM,KAFxB,EAZb;MAAA;IAmBD,CAtBQ,CAAT;IAwBA,OAAO,EAAP;EACD;;AAxC2C,CAAD,CAAtC"}

package/lib/components/VList/_variables.scss

@@ -2,7 +2,7 @@
 @use '../../styles/settings';
 @use '../../styles/tools';
 
-// Defaults
+// VList
 $list-background: rgba(var(--v-theme-surface)) !default;
 $list-border-color: settings.$border-color-root !default;
 $list-border-radius: 0 !default;
@@ -19,10 +19,11 @@ $list-indent-size: 16px !default;
 $list-nav-padding: 8px !default;
 $list-nav-subheader-font-size: .75rem !default;
 
+// VListSubheader
 $list-subheader-font-size: .875rem !default;
-$list-subheader-font-weight: 500 !default;
+$list-subheader-font-weight: 400 !default;
 $list-subheader-inset-margin: 56px !default;
-$list-subheader-inset-padding-start: 72px !default;
+$list-subheader-inset-padding-start: 56px !default;
 $list-subheader-line-height: 1.375rem !default;
 $list-subheader-min-height: 40px !default;
 $list-subheader-padding-end: 16px !default;
@@ -32,17 +33,22 @@ $list-subheader-min-height-multiplier: 1 !default;
 $list-subheader-text-opacity: var(--v-medium-emphasis-opacity) !default;
 $list-subheader-transition: 0.2s min-height settings.$standard-easing !default;
 
+// VListItem
 $list-item-border-color: settings.$border-color-root !default;
 $list-item-border-radius: 0 !default;
 $list-item-border-style: settings.$border-style-root !default;
 $list-item-border-width: 0 !default;
 $list-item-border-thin-width: thin !default;
 $list-item-elevation: 1 !default;
+$list-item-icon-opacity: var(--v-medium-emphasis-opacity) !default;
+$list-item-icon-active-opacity: 1 !default;
 $list-item-min-height: 40px !default;
-$list-item-padding: 8px 16px !default;
+$list-item-padding: 4px 16px !default;
+$list-item-prepend-size: 40px !default;
 $list-item-plain-opacity: .62 !default;
 $list-item-rounded-border-radius: map.get(settings.$rounded, null) !default;
-$list-item-transition: .2s settings.$standard-easing !default;
+$list-item-one-line-min-height: 48px !default;
+$list-item-one-line-padding: 8px 16px !default;
 $list-item-two-line-min-height: 64px !default;
 $list-item-two-line-padding: 12px 16px !default;
 $list-item-three-line-min-height: 88px !default;

package/lib/components/VList/index.mjs

@@ -1,13 +1,10 @@
 export { VList } from "./VList.mjs";
-export { VListSubheader } from "./VListSubheader.mjs";
+export { VListGroup } from "./VListGroup.mjs";
 export { VListImg } from "./VListImg.mjs";
 export { VListItem } from "./VListItem.mjs";
 export { VListItemAction } from "./VListItemAction.mjs";
-export { VListItemAvatar } from "./VListItemAvatar.mjs";
-export { VListItemHeader } from "./VListItemHeader.mjs";
-export { VListItemIcon } from "./VListItemIcon.mjs";
 export { VListItemMedia } from "./VListItemMedia.mjs";
 export { VListItemSubtitle } from "./VListItemSubtitle.mjs";
 export { VListItemTitle } from "./VListItemTitle.mjs";
-export { VListGroup } from "./VListGroup.mjs";
+export { VListSubheader } from "./VListSubheader.mjs";
 //# sourceMappingURL=index.mjs.map