refactor: extract debounce logic into shared composable
- Create useDebounce composable to avoid code duplication - Apply debounce to TextSettings margin/padding inputs - Harmonize debounce delay to 500ms across all components - Fix input lag when typing values like "30mm" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
35c9ab1d3b
commit
681517db21
5 changed files with 40 additions and 29 deletions
|
|
@ -285,6 +285,7 @@
|
|||
import { ref, computed, watch, onMounted } from 'vue';
|
||||
import { useStylesheetStore } from '../stores/stylesheet';
|
||||
import { usePopupPosition } from '../composables/usePopupPosition';
|
||||
import { useDebounce } from '../composables/useDebounce';
|
||||
import NumberInput from './ui/NumberInput.vue';
|
||||
import Coloris from '@melloware/coloris';
|
||||
import '@melloware/coloris/dist/coloris.css';
|
||||
|
|
@ -312,7 +313,7 @@ const inheritanceLocked = ref(true);
|
|||
const backgroundColorInput = ref(null);
|
||||
|
||||
let isUpdatingFromStore = false;
|
||||
let updateTimer = null;
|
||||
const { debouncedUpdate } = useDebounce(500);
|
||||
|
||||
const margins = ref({
|
||||
top: { value: 0, unit: 'mm' },
|
||||
|
|
@ -328,11 +329,6 @@ const background = ref({
|
|||
|
||||
const pattern = ref('');
|
||||
|
||||
const debouncedUpdate = (callback) => {
|
||||
clearTimeout(updateTimer);
|
||||
updateTimer = setTimeout(callback, 1000);
|
||||
};
|
||||
|
||||
const immediateUpdate = (callback) => {
|
||||
callback();
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue