Layout composable changes

This commit is contained in:
tugcekucukoglu
2024-12-06 16:04:53 +03:00
parent 1c65a74541
commit 6fd2e4d96e
5 changed files with 26 additions and 36 deletions
+13 -25
View File
@@ -1,4 +1,4 @@
import { computed, reactive, readonly } from 'vue';
import { computed, reactive } from 'vue';
const layoutConfig = reactive({
preset: 'Aura',
@@ -19,26 +19,10 @@ const layoutState = reactive({
});
export function useLayout() {
const setPrimary = (value) => {
layoutConfig.primary = value;
};
const setSurface = (value) => {
layoutConfig.surface = value;
};
const setPreset = (value) => {
layoutConfig.preset = value;
};
const setActiveMenuItem = (item) => {
layoutState.activeMenuItem = item.value || item;
};
const setMenuMode = (mode) => {
layoutConfig.menuMode = mode;
};
const toggleDarkMode = () => {
if (!document.startViewTransition) {
executeDarkModeToggle();
@@ -54,7 +38,7 @@ export function useLayout() {
document.documentElement.classList.toggle('app-dark');
};
const onMenuToggle = () => {
const toggleMenu = () => {
if (layoutConfig.menuMode === 'overlay') {
layoutState.overlayMenuActive = !layoutState.overlayMenuActive;
}
@@ -66,12 +50,6 @@ export function useLayout() {
}
};
const resetMenu = () => {
layoutState.overlayMenuActive = false;
layoutState.staticMenuMobileActive = false;
layoutState.menuHoverActive = false;
};
const isSidebarActive = computed(() => layoutState.overlayMenuActive || layoutState.staticMenuMobileActive);
const isDarkTheme = computed(() => layoutConfig.darkTheme);
@@ -80,5 +58,15 @@ export function useLayout() {
const getSurface = computed(() => layoutConfig.surface);
return { layoutConfig: readonly(layoutConfig), layoutState: readonly(layoutState), onMenuToggle, isSidebarActive, isDarkTheme, getPrimary, getSurface, setActiveMenuItem, toggleDarkMode, setPrimary, setSurface, setPreset, resetMenu, setMenuMode };
return {
layoutConfig,
layoutState,
toggleMenu,
isSidebarActive,
isDarkTheme,
getPrimary,
getSurface,
setActiveMenuItem,
toggleDarkMode
};
}