@vuetify/nightly 3.0.0-alpha.8 → 3.0.0-beta.0

package/lib/components/VBanner/VBanner.sass

@@ -1,10 +1,10 @@
-// Imports
-@import ./index
+@forward './variables'
+@use '../../styles/tools'
+@use './variables' as *
 
 .v-banner
   $root: &
 
-  background: $banner-background
   display: flex
   flex-wrap: wrap
   font-size: $banner-font-size
@@ -14,11 +14,11 @@
   position: relative
   width: $banner-width
 
-  @include border($banner-border...)
-  @include elevation($banner-elevation)
-  @include position($banner-positions)
-  @include rounded($banner-border-radius)
-  @include theme($banner-theme...)
+  @include tools.border($banner-border...)
+  @include tools.elevation($banner-elevation)
+  @include tools.position($banner-positions)
+  @include tools.rounded($banner-border-radius)
+  @include tools.theme($banner-theme...)
 
   &--border
     border-width: $banner-border-thin-width
@@ -29,12 +29,11 @@
     padding-inline-start: $banner-mobile-padding-start
 
   &--rounded
-    @include rounded($banner-rounded-border-radius)
+    @include tools.rounded($banner-rounded-border-radius)
 
   @at-root
-    @include density('v-banner', $banner-density) using ($modifier)
-      &.v-banner--one-line
-        padding-top: $banner-padding-top + $modifier
+    @include tools.density('v-banner', $banner-density) using ($modifier)
+      padding-top: $banner-padding-top + $modifier
 
       &.v-banner--two-line
         padding-top: $banner-two-line-padding-top + $modifier
@@ -54,7 +53,7 @@
   .v-banner--mobile &
     flex: 1 0
 
-.v-banner-content
+.v-banner__content
   display: flex
   flex: 1 1
   min-width: 0
@@ -70,24 +69,13 @@
   .v-banner--three-line &
     margin-bottom: $banner-three-line-content-margin-bottom
 
-.v-banner-avatar
+.v-banner__avatar
   align-self: flex-start
   border-radius: $banner-avatar-border-radius
   margin-inline-end: $banner-avatar-margin-end
   margin-inline-start: $banner-avatar-margin-start
   position: relative
 
-  &::after
-    background: currentColor
-    border-radius: inherit
-    bottom: 0
-    content: ''
-    left: 0
-    opacity: $banner-avatar-after-opacity
-    position: absolute
-    right: 0
-    top: 0
-
   .v-banner--mobile &
     margin-inline-end: $banner-mobile-avatar-margin-end
 
@@ -96,16 +84,17 @@
 
 .v-banner-text
   -webkit-box-orient: vertical
-  align-self: flex-start
-  color: $banner-text-color
+  align-self: center
   display: -webkit-box
   line-height: $banner-text-line-height
   overflow: hidden
 
   .v-banner--one-line &
-    align-self: center
+    -webkit-line-clamp: 1
 
-  .v-banner--two-line &
+  .v-banner--two-line &,
+  .v-banner--three-line &
+    align-self: flex-start
     -webkit-line-clamp: 2
 
   .v-banner--three-line &

package/lib/components/VBanner/VBannerActions.mjs

@@ -1,3 +1,3 @@
 import { createSimpleFunctional } from "../../util/index.mjs";
-export default createSimpleFunctional('v-banner-actions');
+export const VBannerActions = createSimpleFunctional('v-banner-actions');
 //# sourceMappingURL=VBannerActions.mjs.map

package/lib/components/VBanner/VBannerActions.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBanner/VBannerActions.ts"],"names":["createSimpleFunctional"],"mappings":"SAASA,sB;AAET,eAAeA,sBAAsB,CAAC,kBAAD,CAArC","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport default createSimpleFunctional('v-banner-actions')\n"],"file":"VBannerActions.mjs"}
+{"version":3,"sources":["../../../src/components/VBanner/VBannerActions.ts"],"names":["createSimpleFunctional","VBannerActions"],"mappings":"SAASA,sB;AAET,OAAO,MAAMC,cAAc,GAAGD,sBAAsB,CAAC,kBAAD,CAA7C","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport const VBannerActions = createSimpleFunctional('v-banner-actions')\n"],"file":"VBannerActions.mjs"}

package/lib/components/VBanner/VBannerText.mjs

@@ -1,3 +1,3 @@
 import { createSimpleFunctional } from "../../util/index.mjs";
-export default createSimpleFunctional('v-banner-text');
+export const VBannerText = createSimpleFunctional('v-banner-text');
 //# sourceMappingURL=VBannerText.mjs.map

package/lib/components/VBanner/VBannerText.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBanner/VBannerText.ts"],"names":["createSimpleFunctional"],"mappings":"SAASA,sB;AAET,eAAeA,sBAAsB,CAAC,eAAD,CAArC","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport default createSimpleFunctional('v-banner-text')\n"],"file":"VBannerText.mjs"}
+{"version":3,"sources":["../../../src/components/VBanner/VBannerText.ts"],"names":["createSimpleFunctional","VBannerText"],"mappings":"SAASA,sB;AAET,OAAO,MAAMC,WAAW,GAAGD,sBAAsB,CAAC,eAAD,CAA1C","sourcesContent":["import { createSimpleFunctional } from '@/util'\n\nexport const VBannerText = createSimpleFunctional('v-banner-text')\n"],"file":"VBannerText.mjs"}

package/lib/components/VBanner/_variables.scss

@@ -1,33 +1,33 @@
+@use 'sass:map';
+@use '../../styles/settings';
+@use '../../styles/tools';
+
 // Defaults
-$banner-avatar-after-opacity: var(--v-border-opacity) !default;
-$banner-avatar-after-opacity: var(--v-border-opacity) !default;
-$banner-avatar-border-radius: map-get($rounded, 'circle') !default;
+$banner-avatar-border-radius: map.get(settings.$rounded, 'circle') !default;
 $banner-avatar-margin-end: 24px !default;
 $banner-avatar-margin-start: 0 !default;
-$banner-background: rgb(var(--v-theme-background)) !default;
-$banner-color: rgb(var(--v-theme-on-surface)) !default;
-$banner-border-color: $border-color-root !default;
-$banner-border-radius: map-get($rounded, 0) !default;
-$banner-border-style: $border-style-root !default;
+$banner-background: rgb(var(--v-theme-surface)) !default;
+$banner-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
+$banner-border-color: settings.$border-color-root !default;
+$banner-border-radius: map.get(settings.$rounded, 0) !default;
+$banner-border-style: settings.$border-style-root !default;
 $banner-border-thin-width: thin !default;
 $banner-border-width: 0 0 thin 0 !default;
 $banner-content-padding-end: 90px !default;
 $banner-density: ('default': 0, 'comfortable': -1, 'compact': -2) !default;
 $banner-elevation: 0 !default;
-$banner-font-size: map-deep-get($typography, 'body-2', 'size') !default;
+$banner-font-size: tools.map-deep-get(settings.$typography, 'body-2', 'size') !default;
 $banner-padding-bottom: 8px !default;
 $banner-padding-end: 8px !default;
 $banner-padding-start: 24px !default;
 $banner-padding-top: 10px !default;
 $banner-positions: absolute fixed sticky !default;
-$banner-rounded-border-radius: $border-radius-root !default;
+$banner-rounded-border-radius: settings.$border-radius-root !default;
 $banner-sticky-top: 0 !default;
-$banner-text-color: rgb(var(--v-theme-on-surface)) !default;
-$banner-text-line-height: map-deep-get($typography, 'subtitle-2', 'line-height') !default;
+$banner-text-line-height: tools.map-deep-get(settings.$typography, 'subtitle-2', 'line-height') !default;
 $banner-two-line-content-margin-bottom: 4px !default;
 $banner-two-line-padding-top: 24px !default;
 $banner-three-line-content-margin-bottom: 8px !default;
-$banner-three-line-margin-bottom: 24px !default;
 $banner-three-line-padding-top: 24px !default;
 $banner-width: 100% !default;
 

package/lib/components/VBanner/index.mjs

@@ -1,6 +1,4 @@
-export { default as VBanner } from "./VBanner.mjs";
-export { default as VBannerActions } from "./VBannerActions.mjs";
-export { default as VBannerAvatar } from "./VBannerAvatar.mjs";
-export { default as VBannerContent } from "./VBannerContent.mjs";
-export { default as VBannerText } from "./VBannerText.mjs";
+export { VBanner } from "./VBanner.mjs";
+export { VBannerActions } from "./VBannerActions.mjs";
+export { VBannerText } from "./VBannerText.mjs";
 //# sourceMappingURL=index.mjs.map

package/lib/components/VBanner/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBanner/index.ts"],"names":["default","VBanner","VBannerActions","VBannerAvatar","VBannerContent","VBannerText"],"mappings":"SAASA,OAAO,IAAIC,O;SACXD,OAAO,IAAIE,c;SACXF,OAAO,IAAIG,a;SACXH,OAAO,IAAII,c;SACXJ,OAAO,IAAIK,W","sourcesContent":["export { default as VBanner } from './VBanner'\nexport { default as VBannerActions } from './VBannerActions'\nexport { default as VBannerAvatar } from './VBannerAvatar'\nexport { default as VBannerContent } from './VBannerContent'\nexport { default as VBannerText } from './VBannerText'\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/components/VBanner/index.ts"],"names":["VBanner","VBannerActions","VBannerText"],"mappings":"SAASA,O;SACAC,c;SACAC,W","sourcesContent":["export { VBanner } from './VBanner'\nexport { VBannerActions } from './VBannerActions'\nexport { VBannerText } from './VBannerText'\n"],"file":"index.mjs"}

package/lib/components/VBottomNavigation/VBottomNavigation.css

@@ -0,0 +1,61 @@
+.v-bottom-navigation {
+  display: flex;
+  max-width: 100%;
+  overflow: hidden;
+  position: absolute;
+  border-color: rgba(var(--v-border-color), var(--v-border-opacity));
+  border-style: solid;
+  border-width: 0;
+  border-radius: 0;
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
+.v-bottom-navigation--border {
+  border-width: thin;
+  box-shadow: none;
+}
+.v-bottom-navigation--active {
+  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+}
+
+.v-bottom-navigation__content {
+  display: flex;
+  flex: none;
+  font-size: 0.75rem;
+  justify-content: center;
+  transition: transform, color 0.2s, 0.1s cubic-bezier(0.4, 0, 0.2, 1);
+  width: 100%;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn {
+  font-size: inherit;
+  height: 100%;
+  max-width: 168px;
+  min-width: 80px;
+  text-transform: none;
+  transition: inherit;
+  width: auto;
+  border-radius: 0;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__content,
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
+  transition: inherit;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn .v-btn__icon {
+  font-size: 1.5rem;
+}
+.v-bottom-navigation .v-bottom-navigation__content > .v-btn:not(.v-btn--selected):not(.v-btn--disabled) {
+  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
+}
+.v-bottom-navigation--grow .v-bottom-navigation__content > .v-btn {
+  width: 100%;
+}
+.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn .v-btn__icon {
+  top: 0.5rem;
+  transform: translateY(-0.5rem);
+}
+.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn:not(.v-btn--selected) .v-btn__content {
+  color: rgba(var(--v-theme-on-surface), 0);
+}
+.v-bottom-navigation--shift .v-bottom-navigation__content > .v-btn:not(.v-btn--selected) .v-btn__icon {
+  transform: translateY(0);
+}

package/lib/components/VBottomNavigation/VBottomNavigation.mjs

@@ -1,30 +1,29 @@
 import { createVNode as _createVNode } from "vue";
 // Styles
-import "./VBottomNavigation.sass"; // Composables
+import "./VBottomNavigation.css"; // Composables
 
 import { makeBorderProps, useBorder } from "../../composables/border.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeElevationProps, useElevation } from "../../composables/elevation.mjs";
+import { makeGroupProps, useGroup } from "../../composables/group.mjs";
 import { makeLayoutItemProps, useLayoutItem } from "../../composables/layout.mjs";
 import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
-import { useBackgroundColor, useTextColor } from "../../composables/color.mjs";
-import { useProxiedModel } from "../../composables/proxiedModel.mjs";
-import { makeThemeProps, useTheme } from "../../composables/theme.mjs"; // Utilities
+import { makeThemeProps, useTheme } from "../../composables/theme.mjs";
+import { provideDefaults } from "../../composables/defaults.mjs";
+import { useBackgroundColor } from "../../composables/color.mjs";
+import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 
-import { computed, defineComponent } from 'vue';
-import { convertToUnit } from "../../util/index.mjs";
-import { makeProps } from "../../util/makeProps.mjs";
-export default defineComponent({
+import { computed, toRef } from 'vue';
+import { convertToUnit, defineComponent } from "../../util/index.mjs"; // Types
+
+import { VBtnToggleSymbol } from "../VBtnToggle/VBtnToggle.mjs";
+export const VBottomNavigation = defineComponent({
   name: 'VBottomNavigation',
-  props: makeProps({
+  props: {
     bgColor: String,
     color: String,
     grow: Boolean,
-    modelValue: {
-      type: Boolean,
-      default: true
-    },
     mode: {
       type: String,
       validator: v => !v || ['horizontal', 'shift'].includes(v)
@@ -43,51 +42,71 @@ export default defineComponent({
     ...makeTagProps({
       tag: 'header'
     }),
+    ...makeGroupProps({
+      modelValue: true,
+      selectedClass: 'v-btn--selected'
+    }),
     ...makeThemeProps()
-  }),
+  },
   emits: {
     'update:modelValue': value => true
   },
 
-  setup(props, {
-    slots
-  }) {
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
     const {
       themeClasses
-    } = useTheme(props);
+    } = useTheme();
     const {
       borderClasses
-    } = useBorder(props, 'v-bottom-navigation');
+    } = useBorder(props);
     const {
       backgroundColorClasses,
       backgroundColorStyles
-    } = useBackgroundColor(computed(() => props.bgColor));
-    const {
-      textColorClasses,
-      textColorStyles
-    } = useTextColor(computed(() => props.color));
+    } = useBackgroundColor(toRef(props, 'bgColor'));
     const {
       densityClasses
-    } = useDensity(props, 'v-bottom-navigation');
+    } = useDensity(props);
     const {
       elevationClasses
     } = useElevation(props);
     const {
       roundedClasses
-    } = useRounded(props, 'v-bottom-navigation');
+    } = useRounded(props);
     const height = computed(() => Number(props.height) - (props.density === 'comfortable' ? 8 : 0) - (props.density === 'compact' ? 16 : 0));
     const isActive = useProxiedModel(props, 'modelValue', props.modelValue);
-    const layoutStyles = useLayoutItem(props.name, computed(() => props.priority), computed(() => 'bottom'), computed(() => isActive.value ? height.value : 0), height, isActive);
+    const {
+      layoutItemStyles
+    } = useLayoutItem({
+      id: props.name,
+      priority: computed(() => parseInt(props.priority, 10)),
+      position: computed(() => 'bottom'),
+      layoutSize: computed(() => isActive.value ? height.value : 0),
+      elementSize: height,
+      active: isActive,
+      absolute: toRef(props, 'absolute')
+    });
+    useGroup(props, VBtnToggleSymbol);
+    provideDefaults({
+      VBtn: {
+        color: toRef(props, 'color'),
+        density: toRef(props, 'density'),
+        stacked: computed(() => props.mode !== 'horizontal'),
+        variant: 'text'
+      }
+    }, {
+      scoped: true
+    });
     return () => {
       return _createVNode(props.tag, {
         "class": ['v-bottom-navigation', {
+          'v-bottom-navigation--active': isActive.value,
           'v-bottom-navigation--grow': props.grow,
-          'v-bottom-navigation--horizontal': props.mode === 'horizontal',
-          'v-bottom-navigation--is-active': isActive.value,
-          'v-bottom-navigation--shift': props.mode === 'shift',
-          'v-bottom-navigation--absolute': props.absolute
-        }, themeClasses.value, backgroundColorClasses.value, borderClasses.value, densityClasses.value, elevationClasses.value, roundedClasses.value, textColorClasses.value],
-        "style": [backgroundColorStyles.value, layoutStyles.value, textColorStyles.value, {
+          'v-bottom-navigation--shift': props.mode === 'shift'
+        }, themeClasses.value, backgroundColorClasses.value, borderClasses.value, densityClasses.value, elevationClasses.value, roundedClasses.value],
+        "style": [backgroundColorStyles.value, layoutItemStyles.value, {
           height: convertToUnit(height.value),
           transform: `translateY(${convertToUnit(!isActive.value ? 100 : 0, '%')})`
         }]
@@ -95,7 +114,7 @@ export default defineComponent({
         default: () => [slots.default && _createVNode("div", {
           "class": "v-bottom-navigation__content"
         }, [slots.default()])]
-      }, 8, ["class", "style"]);
+      });
     };
   }
 

package/lib/components/VBottomNavigation/VBottomNavigation.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBottomNavigation/VBottomNavigation.tsx"],"names":["makeBorderProps","useBorder","makeDensityProps","useDensity","makeElevationProps","useElevation","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","useBackgroundColor","useTextColor","useProxiedModel","makeThemeProps","useTheme","computed","defineComponent","convertToUnit","makeProps","name","props","bgColor","String","color","grow","Boolean","modelValue","type","default","mode","validator","v","includes","height","Number","tag","emits","value","setup","slots","themeClasses","borderClasses","backgroundColorClasses","backgroundColorStyles","textColorClasses","textColorStyles","densityClasses","elevationClasses","roundedClasses","density","isActive","layoutStyles","priority","absolute","transform"],"mappings":"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","sourcesContent":["// Styles\nimport './VBottomNavigation.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { useBackgroundColor, useTextColor } from '@/composables/color'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\n\n// Utilities\nimport { computed, defineComponent } from 'vue'\nimport { convertToUnit } from '@/util'\nimport { makeProps } from '@/util/makeProps'\n\nexport default defineComponent({\n  name: 'VBottomNavigation',\n\n  props: makeProps({\n    bgColor: String,\n    color: String,\n    grow: Boolean,\n    modelValue: {\n      type: Boolean,\n      default: true,\n    },\n    mode: {\n      type: String,\n      validator: (v: any) => !v || ['horizontal', 'shift'].includes(v),\n    },\n    height: {\n      type: [Number, String],\n      default: 56,\n    },\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeLayoutItemProps({\n      name: 'bottom-navigation',\n    }),\n    ...makeTagProps({ tag: 'header' }),\n    ...makeThemeProps(),\n  }),\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = useTheme(props)\n    const { borderClasses } = useBorder(props, 'v-bottom-navigation')\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(computed(() => props.bgColor))\n    const { textColorClasses, textColorStyles } = useTextColor(computed(() => props.color))\n    const { densityClasses } = useDensity(props, 'v-bottom-navigation')\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props, 'v-bottom-navigation')\n    const height = computed(() => (\n      Number(props.height) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = useProxiedModel(props, 'modelValue', props.modelValue)\n    const layoutStyles = useLayoutItem(\n      props.name,\n      computed(() => props.priority),\n      computed(() => 'bottom'),\n      computed(() => isActive.value ? height.value : 0),\n      height,\n      isActive\n    )\n\n    return () => {\n      return (\n        <props.tag\n          class={[\n            'v-bottom-navigation',\n            {\n              'v-bottom-navigation--grow': props.grow,\n              'v-bottom-navigation--horizontal': props.mode === 'horizontal',\n              'v-bottom-navigation--is-active': isActive.value,\n              'v-bottom-navigation--shift': props.mode === 'shift',\n              'v-bottom-navigation--absolute': props.absolute,\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n            textColorClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            layoutStyles.value,\n            textColorStyles.value,\n            {\n              height: convertToUnit(height.value),\n              transform: `translateY(${convertToUnit(!isActive.value ? 100 : 0, '%')})`,\n            },\n          ]}\n        >\n          { slots.default && (\n            <div class=\"v-bottom-navigation__content\">\n              { slots.default() }\n            </div>\n          ) }\n        </props.tag>\n      )\n    }\n  },\n})\n"],"file":"VBottomNavigation.mjs"}
+{"version":3,"sources":["../../../src/components/VBottomNavigation/VBottomNavigation.tsx"],"names":["makeBorderProps","useBorder","makeDensityProps","useDensity","makeElevationProps","useElevation","makeGroupProps","useGroup","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","useTheme","provideDefaults","useBackgroundColor","useProxiedModel","computed","toRef","convertToUnit","defineComponent","VBtnToggleSymbol","VBottomNavigation","name","props","bgColor","String","color","grow","Boolean","mode","type","validator","v","includes","height","Number","default","tag","modelValue","selectedClass","emits","value","setup","slots","themeClasses","borderClasses","backgroundColorClasses","backgroundColorStyles","densityClasses","elevationClasses","roundedClasses","density","isActive","layoutItemStyles","id","priority","parseInt","position","layoutSize","elementSize","active","absolute","VBtn","stacked","variant","scoped","transform"],"mappings":"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","sourcesContent":["// Styles\nimport './VBottomNavigation.sass'\n\n// Composables\nimport { makeBorderProps, useBorder } from '@/composables/border'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeGroupProps, useGroup } from '@/composables/group'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, useTheme } from '@/composables/theme'\nimport { provideDefaults } from '@/composables/defaults'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { convertToUnit, defineComponent } from '@/util'\n\n// Types\nimport { VBtnToggleSymbol } from '../VBtnToggle/VBtnToggle'\n\nexport const VBottomNavigation = defineComponent({\n  name: 'VBottomNavigation',\n\n  props: {\n    bgColor: String,\n    color: String,\n    grow: Boolean,\n    mode: {\n      type: String,\n      validator: (v: any) => !v || ['horizontal', 'shift'].includes(v),\n    },\n    height: {\n      type: [Number, String],\n      default: 56,\n    },\n\n    ...makeBorderProps(),\n    ...makeDensityProps(),\n    ...makeElevationProps(),\n    ...makeRoundedProps(),\n    ...makeLayoutItemProps({ name: 'bottom-navigation' }),\n    ...makeTagProps({ tag: 'header' }),\n    ...makeGroupProps({\n      modelValue: true,\n      selectedClass: 'v-btn--selected',\n    }),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (value: any) => true,\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = useTheme()\n    const { borderClasses } = useBorder(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'bgColor'))\n    const { densityClasses } = useDensity(props)\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const height = computed(() => (\n      Number(props.height) -\n      (props.density === 'comfortable' ? 8 : 0) -\n      (props.density === 'compact' ? 16 : 0)\n    ))\n    const isActive = useProxiedModel(props, 'modelValue', props.modelValue)\n    const { layoutItemStyles } = useLayoutItem({\n      id: props.name,\n      priority: computed(() => parseInt(props.priority, 10)),\n      position: computed(() => 'bottom'),\n      layoutSize: computed(() => isActive.value ? height.value : 0),\n      elementSize: height,\n      active: isActive,\n      absolute: toRef(props, 'absolute'),\n    })\n\n    useGroup(props, VBtnToggleSymbol)\n\n    provideDefaults({\n      VBtn: {\n        color: toRef(props, 'color'),\n        density: toRef(props, 'density'),\n        stacked: computed(() => props.mode !== 'horizontal'),\n        variant: 'text',\n      },\n    }, { scoped: true })\n\n    return () => {\n      return (\n        <props.tag\n          class={[\n            'v-bottom-navigation',\n            {\n              'v-bottom-navigation--active': isActive.value,\n              'v-bottom-navigation--grow': props.grow,\n              'v-bottom-navigation--shift': props.mode === 'shift',\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            borderClasses.value,\n            densityClasses.value,\n            elevationClasses.value,\n            roundedClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            layoutItemStyles.value,\n            {\n              height: convertToUnit(height.value),\n              transform: `translateY(${convertToUnit(!isActive.value ? 100 : 0, '%')})`,\n            },\n          ]}\n        >\n          { slots.default && (\n            <div class=\"v-bottom-navigation__content\">\n              { slots.default() }\n            </div>\n          ) }\n        </props.tag>\n      )\n    }\n  },\n})\n\nexport type VBottomNavigation = InstanceType<typeof VBottomNavigation>\n"],"file":"VBottomNavigation.mjs"}

package/lib/components/VBottomNavigation/VBottomNavigation.sass

@@ -1,25 +1,63 @@
-@import './index'
+@forward './variables'
+@use '../../styles/tools'
+@use './variables' as *
 
 .v-bottom-navigation
   display: flex
   max-width: 100%
   overflow: hidden
-  position: fixed
-  transition: $bottom-navigation-transition
-
-  @include border($bottom-navigation-border...)
-  @include rounded($bottom-navigation-border-radius)
-  @include theme($bottom-navigation-theme...)
+  position: absolute
 
-  &--is-active
-    @include elevation($bottom-navigation-elevation)
+  @include tools.border($bottom-navigation-border...)
+  @include tools.rounded($bottom-navigation-border-radius)
+  @include tools.theme($bottom-navigation-theme...)
 
-  &--absolute
-    position: absolute
+  &--active
+    @include tools.elevation($bottom-navigation-elevation)
 
 .v-bottom-navigation__content
   display: flex
   flex: none
+  font-size: $bottom-navigation-content-font-size
   justify-content: center
-  transition: inherit
+  transition: $bottom-navigation-transition
   width: 100%
+
+  .v-bottom-navigation &
+    > .v-btn
+      font-size: inherit
+      height: $bottom-navigation-height
+      max-width: $bottom-navigation-max-width
+      min-width: $bottom-navigation-min-width
+      text-transform: $bottom-navigation-text-transform
+      transition: inherit
+      width: auto
+
+      @include tools.rounded(0)
+
+      .v-btn__content,
+      .v-btn__icon
+        transition: inherit
+
+      .v-btn__icon
+        font-size: $bottom-navigation-icon-font-size
+
+      &:not(.v-btn--selected):not(.v-btn--disabled)
+        color: $bottom-navigation-button-color
+
+  .v-bottom-navigation--grow &
+    > .v-btn
+      width: 100%
+
+  .v-bottom-navigation--shift &
+    > .v-btn
+      .v-btn__icon
+        top: $bottom-navigation-shift-icon-top
+        transform: $bottom-navigation-shift-icon-transform
+
+      &:not(.v-btn--selected)
+        .v-btn__content
+          color: $bottom-navigation-shift-content-color
+
+        .v-btn__icon
+          transform: translateY(0)

package/lib/components/VBottomNavigation/_variables.scss

@@ -1,14 +1,34 @@
+@use 'sass:map';
+@use 'sass:math';
+@use '../../styles/settings';
+@use "../../styles/settings/variables";
+@use "../../styles/tools/functions";
+
 // Defaults
 $bottom-navigation-background: rgb(var(--v-theme-surface)) !default;
-$bottom-navigation-color: rgb(var(--v-theme-on-surface)) !default;
-$bottom-navigation-border-color: $border-color-root !default;
-$bottom-navigation-border-radius: map-get($rounded, '0') !default;
-$bottom-navigation-border-style: $border-style-root !default;
+$bottom-navigation-border-color: settings.$border-color-root !default;
+$bottom-navigation-border-radius: 0 !default;
+$bottom-navigation-border-radius: map.get(settings.$rounded, '0') !default;
+$bottom-navigation-border-style: settings.$border-style-root !default;
 $bottom-navigation-border-thin-width: thin !default;
 $bottom-navigation-border-width: 0 !default;
+$bottom-navigation-content-font-size: functions.map-deep-get(variables.$typography, 'caption', 'size') !default;
 $bottom-navigation-elevation: 4 !default;
 $bottom-navigation-flat-elevation: 0 !default;
-$bottom-navigation-transition: .2s $standard-easing !default;
+$bottom-navigation-height: 100% !default;
+$bottom-navigation-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
+$bottom-navigation-icon-font-size: 1.5rem !default;
+$bottom-navigation-max-width: 168px !default;
+$bottom-navigation-min-width: 80px !default;
+$bottom-navigation-opacity: var(--v-medium-emphasis-opacity) !default;
+$bottom-navigation-button-color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !default;
+$bottom-navigation-text-transform: none !default;
+$bottom-navigation-transition: transform, color .2s, .1s settings.$standard-easing !default;
+
+// Shift
+$bottom-navigation-shift-content-color: rgba(var(--v-theme-on-surface), 0) !default;
+$bottom-navigation-shift-icon-top: math.div($bottom-navigation-icon-font-size, 3) !default;
+$bottom-navigation-shift-icon-transform: translateY(-($bottom-navigation-shift-icon-top)) !default;
 
 $bottom-navigation-border: (
   $bottom-navigation-border-color,

package/lib/components/VBottomNavigation/index.mjs

@@ -1,2 +1,2 @@
-export { default as VBottomNavigation } from "./VBottomNavigation.mjs";
+export { VBottomNavigation } from "./VBottomNavigation.mjs";
 //# sourceMappingURL=index.mjs.map

package/lib/components/VBottomNavigation/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBottomNavigation/index.ts"],"names":["default","VBottomNavigation"],"mappings":"SAASA,OAAO,IAAIC,iB","sourcesContent":["export { default as VBottomNavigation } from './VBottomNavigation'\n"],"file":"index.mjs"}
+{"version":3,"sources":["../../../src/components/VBottomNavigation/index.ts"],"names":["VBottomNavigation"],"mappings":"SAASA,iB","sourcesContent":["export { VBottomNavigation } from './VBottomNavigation'\n"],"file":"index.mjs"}

package/lib/components/VBottomSheet/VBottomSheet.mjs

@@ -1,7 +1,7 @@
 // @ts-nocheck
 
 /* eslint-disable */
-import "./VBottomSheet.sass"; // Extensions
+import "./VBottomSheet.css"; // Extensions
 
 import VDialog from "../VDialog/VDialog.mjs";
 /* @vue/component */

package/lib/components/VBottomSheet/VBottomSheet.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/VBottomSheet/VBottomSheet.ts"],"names":["VDialog","extend","name","props","inset","Boolean","maxWidth","type","String","Number","default","transition","computed","classes","options","call"],"mappings":"AAAA;;AACA;AAEA,6B,CAEA;;OACOA,O;AAEP;;AACA,eAAeA,OAAO,CAACC,MAAR,CAAe;AAC5BC,EAAAA,IAAI,EAAE,gBADsB;AAG5BC,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAEC,OADF;AAELC,IAAAA,QAAQ,EAAE;AACRC,MAAAA,IAAI,EAAE,CAACC,MAAD,EAASC,MAAT,CADE;AAERC,MAAAA,OAAO,EAAE;AAFD,KAFL;AAMLC,IAAAA,UAAU,EAAE;AACVJ,MAAAA,IAAI,EAAEC,MADI;AAEVE,MAAAA,OAAO,EAAE;AAFC;AANP,GAHqB;AAe5BE,EAAAA,QAAQ,EAAE;AACRC,IAAAA,OAAO,GAAY;AACjB,aAAO,EACL,GAAGb,OAAO,CAACc,OAAR,CAAgBF,QAAhB,CAAyBC,OAAzB,CAAiCE,IAAjC,CAAsC,IAAtC,CADE;AAEL,0BAAkB,IAFb;AAGL,iCAAyB,KAAKX;AAHzB,OAAP;AAKD;;AAPO;AAfkB,CAAf,CAAf","sourcesContent":["// @ts-nocheck\n/* eslint-disable */\n\nimport './VBottomSheet.sass'\n\n// Extensions\nimport VDialog from '../VDialog/VDialog'\n\n/* @vue/component */\nexport default VDialog.extend({\n  name: 'v-bottom-sheet',\n\n  props: {\n    inset: Boolean,\n    maxWidth: {\n      type: [String, Number],\n      default: 'auto',\n    },\n    transition: {\n      type: String,\n      default: 'bottom-sheet-transition',\n    },\n  },\n\n  computed: {\n    classes (): object {\n      return {\n        ...VDialog.options.computed.classes.call(this),\n        'v-bottom-sheet': true,\n        'v-bottom-sheet--inset': this.inset,\n      }\n    },\n  },\n})\n"],"file":"VBottomSheet.mjs"}
+{"version":3,"sources":["../../../src/components/VBottomSheet/VBottomSheet.ts"],"names":["VDialog","extend","name","props","inset","Boolean","maxWidth","type","String","Number","default","transition","computed","classes","options","call"],"mappings":"AAAA;;AACA;AAEA,4B,CAEA;;OACOA,O;AAEP;;AACA,eAAeA,OAAO,CAACC,MAAR,CAAe;AAC5BC,EAAAA,IAAI,EAAE,gBADsB;AAG5BC,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAEC,OADF;AAELC,IAAAA,QAAQ,EAAE;AACRC,MAAAA,IAAI,EAAE,CAACC,MAAD,EAASC,MAAT,CADE;AAERC,MAAAA,OAAO,EAAE;AAFD,KAFL;AAMLC,IAAAA,UAAU,EAAE;AACVJ,MAAAA,IAAI,EAAEC,MADI;AAEVE,MAAAA,OAAO,EAAE;AAFC;AANP,GAHqB;AAe5BE,EAAAA,QAAQ,EAAE;AACRC,IAAAA,OAAO,GAAY;AACjB,aAAO,EACL,GAAGb,OAAO,CAACc,OAAR,CAAgBF,QAAhB,CAAyBC,OAAzB,CAAiCE,IAAjC,CAAsC,IAAtC,CADE;AAEL,0BAAkB,IAFb;AAGL,iCAAyB,KAAKX;AAHzB,OAAP;AAKD;;AAPO;AAfkB,CAAf,CAAf","sourcesContent":["// @ts-nocheck\n/* eslint-disable */\n\nimport './VBottomSheet.sass'\n\n// Extensions\nimport VDialog from '../VDialog/VDialog'\n\n/* @vue/component */\nexport default VDialog.extend({\n  name: 'v-bottom-sheet',\n\n  props: {\n    inset: Boolean,\n    maxWidth: {\n      type: [String, Number],\n      default: 'auto',\n    },\n    transition: {\n      type: String,\n      default: 'bottom-sheet-transition',\n    },\n  },\n\n  computed: {\n    classes (): object {\n      return {\n        ...VDialog.options.computed.classes.call(this),\n        'v-bottom-sheet': true,\n        'v-bottom-sheet--inset': this.inset,\n      }\n    },\n  },\n})\n"],"file":"VBottomSheet.mjs"}

package/lib/components/VBreadcrumbs/VBreadcrumbs.css

@@ -0,0 +1,48 @@
+.v-breadcrumbs {
+  line-height: 1.375rem;
+  padding: 16px 12px;
+}
+.v-breadcrumbs--rounded {
+  border-radius: 4px;
+}
+.v-breadcrumbs--density-default {
+  padding-top: 16px 12px0px;
+  padding-bottom: 16px 12px0px;
+}
+
+.v-breadcrumbs--density-comfortable {
+  padding-top: 16px 12px-4px;
+  padding-bottom: 16px 12px-4px;
+}
+
+.v-breadcrumbs--density-compact {
+  padding-top: 16px 12px-8px;
+  padding-bottom: 16px 12px-8px;
+}
+
+.v-breadcrumbs-item {
+  align-items: center;
+  color: inherit;
+  display: inline-flex;
+  padding: 0 4px;
+  text-decoration: none;
+  vertical-align: middle;
+}
+.v-breadcrumbs-item--disabled {
+  opacity: var(--v-disabled-opacity);
+  pointer-events: none;
+}
+.v-breadcrumbs-item--link:hover {
+  text-decoration: underline;
+}
+.v-breadcrumbs-item .v-icon {
+  font-size: 1rem;
+  margin-inline-start: -4px;
+  margin-inline-end: 2px;
+}
+
+.v-breadcrumbs-divider {
+  display: inline-block;
+  padding: 0 8px;
+  vertical-align: middle;
+}