--- description: globs: alwaysApply: false --- # State Management The project uses Pinia for state management. Key stores include: ## Stores - **[formBuilder.js](mdc:stores/formBuilder.js)**: Manages state for the form builder feature - Handles form components, properties, and history - Controls drag-and-drop operations - Manages form validation and submission - **[user.js](mdc:stores/user.js)**: Manages user authentication and profile - Stores user information - Handles login/logout operations - Manages user permissions - **[theme.js](mdc:stores/theme.js)**: Controls application theming - Manages light/dark mode - Stores user theme preferences - **[layout.js](mdc:stores/layout.js)**: Controls application layout - Manages sidebar state - Controls responsive layout changes ## Usage Guidelines - Use Pinia stores for shared state that needs to be accessed across components - Keep component-specific state within components using Vue's Composition API - For form state, prefer FormKit's built-in state management - Use persisted state (localStorage) for user preferences