fix(VBottomNavigation): remove internal translate and fix active/mode…

…lValue
vuetifyjs · Apr 11, 2024 · 54e33b6 · 54e33b6
1 parent 0cd9e54
commit 54e33b6
Showing 1 changed file with 3 additions and 6 deletions.
diff --git a/packages/vuetify/src/components/VBottomNavigation/VBottomNavigation.tsx b/packages/vuetify/src/components/VBottomNavigation/VBottomNavigation.tsx
@@ -51,10 +51,7 @@ export const makeVBottomNavigationProps = propsFactory({
   ...makeRoundedProps(),
   ...makeLayoutItemProps({ name: 'bottom-navigation' }),
   ...makeTagProps({ tag: 'header' }),
-  ...makeGroupProps({
-    modelValue: true,
-    selectedClass: 'v-btn--selected',
-  }),
+  ...makeGroupProps({ selectedClass: 'v-btn--selected' }),
   ...makeThemeProps(),
 }, 'VBottomNavigation')
 
@@ -70,6 +67,7 @@ export const VBottomNavigation = genericComponent<new <T>(
   props: makeVBottomNavigationProps(),
 
   emits: {
+    'update:active': (value: any) => true,
     'update:modelValue': (value: any) => true,
   },
 
@@ -86,7 +84,7 @@ export const VBottomNavigation = genericComponent<new <T>(
       (props.density === 'comfortable' ? 8 : 0) -
       (props.density === 'compact' ? 16 : 0)
     ))
-    const isActive = useProxiedModel(props, 'modelValue', props.modelValue)
+    const isActive = useProxiedModel(props, 'active', props.active)
     const { layoutItemStyles, layoutIsReady } = useLayoutItem({
       id: props.name,
       order: computed(() => parseInt(props.order, 10)),
@@ -132,7 +130,6 @@ export const VBottomNavigation = genericComponent<new <T>(
             layoutItemStyles.value,
             {
               height: convertToUnit(height.value),
-              transform: `translateY(${convertToUnit(!isActive.value ? 100 : 0, '%')})`,
             },
             ssrBootStyles.value,
             props.style,