refactor: Use input type=number for field_number.ts (#6845)

This commit is contained in:
Aaron Dodson
2023-02-14 13:37:28 -08:00
committed by GitHub
parent 7255d980d6
commit a312e9e3d3
2 changed files with 16 additions and 2 deletions

View File

@@ -340,6 +340,17 @@ let content = `
display: none;
}
/* Remove the increase and decrease arrows on the field number editor */
input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type=number] {
-moz-appearance: textfield;
}
.blocklyMainBackground {
stroke-width: 1;
stroke: #c6c6c6; /* Equates to #ddd due to border being off-pixel. */

View File

@@ -291,14 +291,17 @@ export class FieldNumber extends FieldInput<number> {
*
* @returns The newly created number input editor.
*/
protected override widgetCreate_(): HTMLElement {
const htmlInput = super.widgetCreate_();
protected override widgetCreate_(): HTMLInputElement {
const htmlInput = super.widgetCreate_() as HTMLInputElement;
htmlInput.type = 'number';
// Set the accessibility state
if (this.min_ > -Infinity) {
htmlInput.min = `${this.min_}`;
aria.setState(htmlInput, aria.State.VALUEMIN, this.min_);
}
if (this.max_ < Infinity) {
htmlInput.max = `${this.max_}`;
aria.setState(htmlInput, aria.State.VALUEMAX, this.max_);
}
return htmlInput;