Fix issues with state history for text value and color

This commit is contained in:
Igor Zinken
2026-04-18 07:51:29 +02:00
parent da3ae37dbd
commit d8e3e3957c
2 changed files with 24 additions and 7 deletions

View File

@@ -175,7 +175,7 @@ export default {
this.renderPending = true;
window.setTimeout(() => {
this.renderPending = false;
this.update( null, `value_${this.text}` );
this.update({ value: this.internalText }, "value" );
}, 50 );
}
},
@@ -236,12 +236,15 @@ export default {
watch: {
activeLayer: {
immediate: true,
handler( layer: Layer ): void {
if ( layer && this.layerId !== layer.id ) {
this.internalText = layer.text?.value;
this.syncText = this.internalText === layer.name || layer.name === DEFAULT_LAYER_NAME;
this.layerId = layer.id;
handler( layer?: Layer ): void {
if ( !layer ) {
return;
}
if ( this.layerId !== layer.id ) {
this.layerId = layer.id;
}
this.internalText = layer.text?.value;
this.syncText = this.internalText === layer.name || layer.name === DEFAULT_LAYER_NAME;
}
},
},
@@ -308,6 +311,7 @@ export default {
const { left, top, width, height } = this.activeLayer;
const commit = () => store.commit( "updateLayer", { index, opts: { name: newName, text: newOpts } });
commit();
enqueueState( `${propName}_${index}`, {
undo() {
store.commit( "updateLayer", { index, opts: { left, top, width, height, name: orgName, text: orgOpts } });

View File

@@ -62,6 +62,7 @@ export default {
},
watch: {
modelValue( color: string ): void {
this.lock();
this.pickrInstance?.setColor( color );
},
swatches( value: string[], oldValue?: string[] ): void {
@@ -105,6 +106,7 @@ export default {
window.pickrInstance = this.pickrInstance;
this.globalInstance = true;
}
this._locked = false;
},
destroy(): void {
this.pickrInstance?.destroyAndRemove();
@@ -113,6 +115,17 @@ export default {
}
},
methods: {
// when updating the color from the synced model value
// we shouldn't emit an update on the saveColor handler
lock(): void {
if ( this._locked ) {
return;
}
this._locked = true;
queueMicrotask(() => {
this._locked = false;
});
},
saveColor( value: { toHEXA: () => number[], toRGBA: () => number[] } ): void {
let parsedValue: string;
@@ -129,7 +142,7 @@ export default {
parsedValue = value.toHEXA().toString();
}
if ( this.modelValue !== parsedValue ) {
if ( !this._locked && this.modelValue !== parsedValue ) {
this.$emit( "update:modelValue", parsedValue );
}
},