fix alignment helper elements not being removed correctly

This commit is contained in:
Aran-Fey
2024-07-07 15:42:09 +02:00
parent f75d6c392f
commit 05f2330be7
4 changed files with 22 additions and 27 deletions

View File

@@ -134,9 +134,10 @@ export abstract class ComponentBase {
if (this.outerAlignElement !== null) {
replaceElement(
this.outerAlignElement,
this.outerAlignElement.firstChild!
this.innerAlignElement!.firstChild!
);
this.outerAlignElement = null;
this.innerAlignElement = null;
}
} else {
// Create the alignElement if we don't have one already

View File

@@ -33,8 +33,6 @@ export class GridComponent extends ComponentBase {
): void {
super.updateElement(deltaState, latentComponents);
let element = this.element;
if (deltaState._children !== undefined) {
let childPositions =
deltaState._child_positions ?? this.state._child_positions;
@@ -65,11 +63,11 @@ export class GridComponent extends ComponentBase {
}
if (deltaState.row_spacing !== undefined) {
element.style.rowGap = `${deltaState.row_spacing}rem`;
this.element.style.rowGap = `${deltaState.row_spacing}rem`;
}
if (deltaState.column_spacing !== undefined) {
element.style.columnGap = `${deltaState.column_spacing}rem`;
this.element.style.columnGap = `${deltaState.column_spacing}rem`;
}
}

View File

@@ -707,8 +707,6 @@ export class KeyEventListenerComponent extends ComponentBase {
): void {
super.updateElement(deltaState, latentComponents);
let element = this.element;
let reportKeyDown =
deltaState.reportKeyDown ?? this.state.reportKeyDown;
let reportKeyUp = deltaState.reportKeyUp ?? this.state.reportKeyUp;
@@ -716,7 +714,7 @@ export class KeyEventListenerComponent extends ComponentBase {
deltaState.reportKeyPress ?? this.state.reportKeyPress;
if (reportKeyDown || reportKeyPress) {
element.onkeydown = (e: KeyboardEvent) => {
this.element.onkeydown = (e: KeyboardEvent) => {
let encodedEvent = encodeEvent(e);
if (reportKeyPress) {
@@ -734,18 +732,18 @@ export class KeyEventListenerComponent extends ComponentBase {
}
};
} else {
element.onkeydown = null;
this.element.onkeydown = null;
}
if (reportKeyUp) {
element.onkeyup = (e: KeyboardEvent) => {
this.element.onkeyup = (e: KeyboardEvent) => {
this.sendMessageToBackend({
type: 'KeyUp',
...encodeEvent(e),
});
};
} else {
element.onkeyup = null;
this.element.onkeyup = null;
}
this.replaceOnlyChild(latentComponents, deltaState.content);

View File

@@ -36,24 +36,22 @@ export class ProgressBarComponent extends ComponentBase {
): void {
super.updateElement(deltaState, latentComponents);
// No progress specified
if (deltaState.progress === undefined) {
}
if (deltaState.progress !== undefined) {
// Indeterminate progress
if (deltaState.progress === null) {
this.element.classList.add('rio-progress-bar-indeterminate');
}
// Indeterminate progress
else if (deltaState.progress === null) {
this.element.classList.add('rio-progress-bar-indeterminate');
}
// Known progress
else {
let progress = Math.max(0, Math.min(1, deltaState.progress));
// Known progress
else {
let progress = Math.max(0, Math.min(1, deltaState.progress));
this.element.style.setProperty(
'--rio-progress-bar-fraction',
`${progress * 100}%`
);
this.element.classList.remove('rio-progress-bar-indeterminate');
this.element.style.setProperty(
'--rio-progress-bar-fraction',
`${progress * 100}%`
);
this.element.classList.remove('rio-progress-bar-indeterminate');
}
}
// Apply the color