fix: typo

packages/layouts/src/components/setting/components/SettingButtonPosition.vue

@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import SettingDrawer from "./SettingDrawer.vue";
 import {ref} from "vue";
-import {useComosables} from "../../../useComosables";
+import {useComposables} from "../../../useComposables";
 
 const settingDrawerVisible = ref(false)
-const {contentRef} = useComosables()
+const {contentRef} = useComposables()
 </script>
 <template>
   <VbenAffix @click="settingDrawerVisible = true"

packages/layouts/src/left-menu.vue

@@ -1,11 +1,11 @@
 <script lang="ts" setup>
-import { useComosables } from './useComosables'
+import { useComposables } from './useComposables'
 import LayoutMenu from './components/menu/index.vue'
 import LayoutHeader from './components/header.vue'
 import LayoutMain from './components/main.vue'
 import LayoutFooter from './components/footer.vue'
 import { useAppConfig } from '@vben/hooks'
-const { headerRef, contentStyle, mainStyle, footerRef } = useComosables()
+const { headerRef, contentStyle, mainStyle, footerRef } = useComposables()
 const { toggleCollapse, sidebar, footer } = useAppConfig()
 </script>
 <template>

packages/layouts/src/mix-sidebar.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import {useComosables} from './useComosables'
+import {useComposables} from './useComposables'
 import LayoutMixMenu from './components/mixSideBar/Menu.vue'
 import LayoutHeader from './components/header.vue'
 import LayoutMain from './components/main.vue'
@@ -8,7 +8,7 @@ import { context } from '../bridge'
 import {computed, unref} from 'vue';
 import {SIDE_BAR_MINI_WIDTH, SIDE_BAR_SHOW_TIT_MINI_WIDTH} from '@vben/constants'
 const { useMenuSetting,useRootSetting } = context
-const {headerRef, contentStyle, mainStyle, footerRef} = useComosables()
+const {headerRef, contentStyle, mainStyle, footerRef} = useComposables()
 
 const { getCollapsed, getMenuWidth, getMixSideFixed,getShowSidebar } = useMenuSetting()
 const { getShowFooter } = useRootSetting();

packages/layouts/src/mobile-menu.vue

@@ -5,13 +5,13 @@ import LayoutMain from './components/main.vue'
 import LayoutFooter from './components/footer.vue'
 import { context } from '../bridge'
 import {onMounted, ref, unref} from "vue";
-import { useComosables} from './useComosables'
+import { useComposables} from './useComposables'
 const { useMenuSetting, Logo, useRootSetting } = context
 
 const { getMenuWidth } = useMenuSetting()
 const { getShowFooter } = useRootSetting();
 
-const {headerRef, footerRef, contentStyle, mainStyle} = useComosables()
+const {headerRef, footerRef, contentStyle, mainStyle} = useComposables()
 
 const active = ref(false);
 onMounted(()=>{

packages/layouts/src/top-menu-mixed.vue

@@ -5,14 +5,14 @@ import LayoutTabs from './components/tabs/index.vue'
 import LayoutMain from './components/main.vue'
 import LayoutFooter from './components/footer.vue'
 import { context } from '../bridge'
-import { useComosables } from './useComosables'
+import { useComposables } from './useComposables'
 import {computed, unref} from 'vue'
 const { useMenuSetting,useRootSetting, useMultipleTabSetting } = context
 const { toggleCollapsed, getCollapsed, getMenuWidth, getShowSidebar } = useMenuSetting()
 const { getShowFooter } = useRootSetting();
 const { getShowMultipleTab } = useMultipleTabSetting();
 
-const {headerRef, tabRef, footerRef, headerHeight, contentStyle, mainStyle} = useComosables()
+const {headerRef, tabRef, footerRef, headerHeight, contentStyle, mainStyle} = useComposables()
 
 const menuHeight = computed(() => `calc(100vh - ${unref(headerHeight)}px)`)
 

packages/layouts/src/top-menu.vue

@@ -3,9 +3,9 @@ import LayoutHeader from './components/header.vue'
 import LayoutMenu from './components/menu/index.vue'
 import LayoutMain from './components/main.vue'
 import LayoutFooter from './components/footer.vue'
-import { useComosables} from './useComosables'
+import { useComposables} from './useComposables'
 import {context} from "../bridge";
-const {headerRef, footerRef, contentStyle, mainStyle} = useComosables()
+const {headerRef, footerRef, contentStyle, mainStyle} = useComposables()
 const { useRootSetting } = context
 const { getShowFooter } = useRootSetting();
 </script>

packages/layouts/src/useComosables.ts → packages/layouts/src/useComposables.ts

@@ -2,7 +2,7 @@ import {computed, ref, unref} from 'vue'
 import {useElementSize} from '@vben/utils'
 import {context} from '../bridge'
 
-export const useComosables = () => {
+export const useComposables = () => {
   const {useHeaderSetting} = context
   // @ts-ignore
   const {getFixed: getHeaderFixed} = useHeaderSetting();