import { defineStore } from 'pinia' import { ref } from 'vue' // v2 shell UI state ONLY (RFC-WS-GUI-REDESIGN AD-G4). No tenant/org // state — that stays in useAuthStore/useOrganisationStore. Owns the // writes to //.dark (composes with // Aura darkModeSelector '.dark'); v2 bypasses Vuexy useSkins.ts. export type ShellTheme = 'light' | 'dark' export type ShellDensity = 'comfortable' | 'compact' export interface ShellDrawerState { isOpen: boolean component: string | null props: Record } export const useShellUiStore = defineStore('shellUi', () => { const sidebarCollapsed = ref(false) const density = ref('comfortable') const theme = ref('light') const drawer = ref({ isOpen: false, component: null, props: {} }) function toggleSidebar(): void { sidebarCollapsed.value = !sidebarCollapsed.value } function setTheme(next: ShellTheme): void { theme.value = next } function setDensity(next: ShellDensity): void { density.value = next } function applyDomAttributes(): void { const el = document.documentElement el.setAttribute('data-theme', theme.value) el.setAttribute('data-density', density.value) el.classList.toggle('dark', theme.value === 'dark') } function openDrawer(component: string, props: Record = {}): void { drawer.value = { isOpen: true, component, props } } function closeDrawer(): void { drawer.value = { isOpen: false, component: null, props: {} } } return { sidebarCollapsed, density, theme, drawer, toggleSidebar, setTheme, setDensity, applyDomAttributes, openDrawer, closeDrawer, } })