feat: improve code editor formatting behavior
- Disable auto-formatting while in editing mode - Format CSS only when exiting editing mode - Auto-disable editing mode when switching tabs 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
de5d12c0fa
commit
0df5d7c6e9
2 changed files with 23 additions and 3 deletions
|
|
@ -6,6 +6,7 @@ import parserPostcss from 'prettier/plugins/postcss';
|
|||
|
||||
export const useStylesheetStore = defineStore('stylesheet', () => {
|
||||
const content = ref('');
|
||||
const isEditing = ref(false);
|
||||
let formatTimer = null;
|
||||
let isFormatting = false;
|
||||
|
||||
|
|
@ -30,9 +31,9 @@ export const useStylesheetStore = defineStore('stylesheet', () => {
|
|||
}
|
||||
};
|
||||
|
||||
// Watch content and format after 500ms of inactivity
|
||||
// Watch content and format after 500ms of inactivity (only when not editing)
|
||||
watch(content, () => {
|
||||
if (isFormatting) return;
|
||||
if (isFormatting || isEditing.value) return;
|
||||
|
||||
clearTimeout(formatTimer);
|
||||
formatTimer = setTimeout(() => {
|
||||
|
|
@ -65,6 +66,7 @@ export const useStylesheetStore = defineStore('stylesheet', () => {
|
|||
|
||||
return {
|
||||
content,
|
||||
isEditing,
|
||||
loadStylesheet,
|
||||
updateProperty,
|
||||
extractValue,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue