Skip to main content

Class: FieldTextInput

Defined in: packages/blockly/core/field_textinput.ts:25

Class for an editable text field.

Extends​

  • FieldInput<string>

Properties index​

PropertyDescription
DEFAULT_VALUETo overwrite the default value which is set in Field, directly update the prototype.
NBSPNon-breaking space.
SKIP_SETUPA value used to signal when a field's constructor should not set the field's value or run configure_, and should allow a subclass to do that instead.
nameName of field. Unique within each block. Static labels are usually unnamed.
value_-
validator_Validation function called when user edits an editable field.
ariaTypeNameThe ARIA-friendly label representation of this field's type.
fieldGroup_The rendered field's SVG group element.
borderRect_The rendered field's SVG border element.
textElement_The rendered field's SVG text element.
textContent_The rendered field's text content element.
constants_Constants associated with the source block's renderer.
maxDisplayLengthMaximum characters of text to display before adding an ellipsis.
sourceBlock_Block this field is attached to. Starts as null, then set in init.
isDirty_Does this block need to be re-rendered?
visible_Is the field visible, or hidden due to the block being collapsed?
enabled_Can the field value be changed using the editor on an editable block?
clickTarget_The element the click handler is bound to.
EDITABLEEditable fields usually show some sort of UI indicating they are editable. They will also be saved by the serializer.
BORDERRADIUSPixel size of input border radius. Should match blocklyText's border-radius in CSS.
spellcheck_Allow browser to spellcheck this field.
htmlInput_The HTML input element.
isBeingEdited_True if the field's value is currently being edited via the UI.
isTextValid_True if the value currently displayed in the field's editory UI is valid.
warningIconThe warning icon to display on invalid input
valueWhenEditorWasOpened_The intial value of the field when the user opened an editor to change its value. When the editor is disposed, an event will be fired that uses this as the event's oldValue.
fullBlockClickTarget_Whether the field should consider the whole parent block to be its click target.
workspace_The workspace that this field belongs to.
SERIALIZABLESerializable fields are saved by the serializer, non-serializable fields are not. Editable fields should also be serializable.

Methods index​

MethodDescription
setSourceBlockAttach this field to a block.
getConstantsGet the renderer constant provider.
getSourceBlockGet the block this field is attached to.
setAriaTypeNameSets the ARIA-friendly label representation of this field's type.
computeAriaLabelComputes a descriptive ARIA label to represent this field with configurable verbosity.
initModelInitializes the model of the field after it has been installed on a block. No-op by default.
createBorderRect_Create a field border rect element. Not to be overridden by subclasses. Instead modify the result of the function inside initView, or create a separate function to call.
createTextElement_Create a field text element. Not to be overridden by subclasses. Instead, modify the result of the function inside initView, or create a separate function to call. Aria state is hidden; use the aria label for the field and/or containing block to expose content to screen readers. Text content for custom blocks can be set after creation.
bindEvents_Bind events to the field. Can be overridden by subclasses if they need to do custom input handling.
fromXmlSets the field's value based on the given XML element. Should only be called by Blockly.Xml.
toXmlSerializes this field's value to XML. Should only be called by Blockly.Xml.
saveStateSaves this fields value as something which can be serialized to JSON. Should only be called by the serialization system.
loadStateSets the field's state based on the given state value. Should only be called by the serialization system.
saveLegacyStateReturns a stringified version of the XML state, if it should be used. Otherwise this returns null, to signal the field should use its own serialization.
loadLegacyStateLoads the given state using either the old XML hooks, if they should be used. Returns true to indicate loading has been handled, false otherwise.
disposeDispose of all DOM objects and events belonging to this editable field.
updateEditableAdd or remove the UI indicating if this field is editable or not.
setEnabledSet whether this field's value can be changed using the editor when the source block is editable.
isEnabledCheck whether this field's value can be changed using the editor when the source block is editable.
isClickableCheck whether this field defines the showEditor_ function.
isClickableInFlyoutCheck whether the field should be clickable while the block is in a flyout. The default is that fields are clickable in always-open flyouts such as the simple toolbox, but not in autoclosing flyouts such as the category toolbox. Subclasses may override this function to change this behavior. Note that isClickable must also return true for this to have any effect.
isCurrentlyEditableCheck whether this field is currently editable. Some fields are never EDITABLE (e.g. text labels). Other fields may be EDITABLE but may exist on non-editable blocks or be currently disabled.
isSerializableCheck whether this field should be serialized by the XML renderer. Handles the logic for backwards compatibility and incongruous states.
isVisibleGets whether this editable field is visible or not.
setValidatorSets a new validation function for editable fields, or clears a previously set validator.
getValidatorGets the validation function for editable fields, or null if not set.
getSvgRootGets the group element for this editable field. Used for measuring the size and for positioning.
getBorderRectGets the border rectangle element.
getTextElementGets the text element.
getTextContentGets the text content.
updateSize_Updates the size of the field based on the text.
positionBorderRect_Position a field's border rect after a size change.
getDisplayText_Get the text from this field to display on the block. May differ from getText due to ellipsis, and other formatting.
getTextGet the text from this field. Override getText_ to provide a different behavior than simply casting the value to a string.
forceRerenderForce a rerender of the block that this field is installed on, which will rerender this field and adjust for any sizing changes. Other fields on the same block will not rerender, because their sizes have already been recorded.
setValueUsed to change the value of the field. Handles validation and events. Subclasses should override doClassValidation_ and doValueUpdate_ rather than this method.
getValueGet the current value of the field.
onMouseDown_Handle a pointerdown event on a field.
setTooltipSets the tooltip for this field.
getTooltipReturns the tooltip text for this field.
getClickTarget_The element to bind the click handler to. If not set explicitly, defaults to the SVG root of the field. When this element is clicked on an editable field, the editor will open.
getAbsoluteXY_Return the absolute coordinates of the top-left corner of this field. The origin (0,0) is the top-left corner of the page body.
referencesVariablesWhether this field references any Blockly variables. If true it may need to be handled differently during serialization and deserialization. Subclasses may override this.
refreshVariableNameRefresh the variable name referenced by this field if this field references variables.
getFlipRtlReturns whether or not we should flip the field in RTL.
onShortcutHandles the given keyboard shortcut.
getFocusableElementSee IFocusableNode.getFocusableElement.
getFocusableTreeSee IFocusableNode.getFocusableTree.
onNodeFocusSee IFocusableNode.onNodeFocus.
onNodeBlurSee IFocusableNode.onNodeBlur.
canBeFocusedSee IFocusableNode.canBeFocused.
performActionHandles the user acting on this field via keyboard navigation. Shows and focuses the field editor.
configure_Process the configuration map passed to the field.
isFullBlockFieldDefines whether this field should take up the full block or not.
createWarningIconCreates the DOM elements for the invalid input warning icon.
doValueInvalid_Called by setValue if the text input is not valid. If the field is currently being edited it reverts value of the field to the previous value while allowing the display text to be handled by the htmlInput_.
doValueUpdate_Called by setValue if the text input is valid. Updates the value of the field, and updates the text of the field if it is not currently being edited (i.e. handled by the htmlInput_).
applyColourUpdates text field to match the colour/style of the block.
getSizeReturns the height and width of the field.
onLocationChangeNotifies the field that it has changed locations. Moves the widget div to be in the correct place if it is open.
render_Updates the colour of the htmlInput given the current validity of the field's value.
renderWarningIcon-
setSpellcheckSet whether this field is spellchecked by the browser.
showEditor_Show an editor for the field. Shows the inline free-text editor on top of the text by default. Shows a prompt editor for mobile browsers if the modalInputs option is enabled.
widgetCreate_Create the text input editor widget.
widgetDispose_Closes the editor, saves the results, and disposes of any events or DOM-references belonging to the editor.
onFinishEditing_A callback triggered when the user is done editing the field via the UI.
bindInputEvents_Bind handlers for user input on the text input field's editor.
unbindInputEvents_Unbind handlers for user input and workspace size changes.
onHtmlInputKeyDown_Handle key down to the editor.
setEditorValue_Set the HTML input value and the field's internal value. The difference between this and setValue is that this also updates the HTML input value whilst editing.
resizeEditor_Resize the editor to fit the text.
repositionForWindowResizeHandles repositioning the WidgetDiv used for input fields when the workspace is resized. Scrolls this field into view, then updates the position of the text input.
positionTextElement_Position a field's text element after a size change. This handles both LTR and RTL positioning.
getText_Use the getText_ developer hook to override the field's text representation. When we're currently editing, return the current HTML value instead. Otherwise, return null which tells the field to use the default behaviour (which is a string cast of the field's value).
getEditorText_Transform the provided value into a text to show in the HTML input. Override this method if the field's HTML input representation is different than the field's value. This should be coupled with an override of getValueFromEditorText_.
getValueFromEditorText_Transform the text received from the HTML input into a value to store in this field. Override this method if the field's HTML input representation is different than the field's value. This should be coupled with an override of getEditorText_.
getAriaValueGets an ARIA-friendly label representation of this field's value.
recomputeAriaContextCustomizes the label for this field to include "editable" if it applies.
initView-
doClassValidation_Ensure that the input value casts to a valid string.
getAriaTypeNameGets an ARIA-friendly label representation of this field's type.

Constructors​

Constructor​

new FieldTextInput(
value?,
validator?,
config?
): FieldTextInput;

Defined in: packages/blockly/core/field_textinput.ts:40

Parameters​

ParameterTypeDescription
value?string | typeof SKIP_SETUPThe initial value of the field. Should cast to a string. Defaults to an empty string if null or undefined. Also accepts Field.SKIP_SETUP if you wish to skip setup (only used by subclasses that want to handle configuration and setting the field value after their own constructors have run).
validator?| FieldTextInputValidator | nullA function that is called to validate changes to the field's value. Takes in a string & returns a validated string, or null to abort the change.
config?FieldInputConfigA map of options used to configure the field. See the [field creation documentation]https://docs.blockly.com/guides/create-custom-blocks/fields/built-in-fields/text-input/#creation for a list of properties this parameter supports.

Returns​

FieldTextInput

Overrides​

FieldInput<string>.constructor

Properties​

DEFAULT_VALUE​

DEFAULT_VALUE: string | null = null;

Defined in: packages/blockly/core/field.ts:79

To overwrite the default value which is set in Field, directly update the prototype.

Example: FieldImage.prototype.DEFAULT_VALUE = null;

Inherited from​

FieldInput.DEFAULT_VALUE

NBSP​

readonly static NBSP: " " = '\u00A0';

Defined in: packages/blockly/core/field.ts:82

Non-breaking space.

Inherited from​

FieldInput.NBSP

SKIP_SETUP​

readonly static SKIP_SETUP: typeof SKIP_SETUP;

Defined in: packages/blockly/core/field.ts:89

A value used to signal when a field's constructor should not set the field's value or run configure_, and should allow a subclass to do that instead.

Inherited from​

FieldInput.SKIP_SETUP

name?​

optional name?: string = undefined;

Defined in: packages/blockly/core/field.ts:95

Name of field. Unique within each block. Static labels are usually unnamed.

Inherited from​

FieldInput.name

value_​

protected value_: string | null;

Defined in: packages/blockly/core/field.ts:96

Inherited from​

FieldInput.value_

validator_​

protected validator_:
| FieldValidator<string>
| null = null;

Defined in: packages/blockly/core/field.ts:99

Validation function called when user edits an editable field.

Inherited from​

FieldInput.validator_

ariaTypeName​

protected ariaTypeName: string | null = null;

Defined in: packages/blockly/core/field.ts:102

The ARIA-friendly label representation of this field's type.

Inherited from​

FieldInput.ariaTypeName

fieldGroup_​

protected fieldGroup_: SVGGElement | null = null;

Defined in: packages/blockly/core/field.ts:130

The rendered field's SVG group element.

Inherited from​

FieldInput.fieldGroup_

borderRect_​

protected borderRect_: SVGRectElement | null = null;

Defined in: packages/blockly/core/field.ts:133

The rendered field's SVG border element.

Inherited from​

FieldInput.borderRect_

textElement_​

protected textElement_: SVGTextElement | null = null;

Defined in: packages/blockly/core/field.ts:136

The rendered field's SVG text element.

Inherited from​

FieldInput.textElement_

textContent_​

protected textContent_: Text | null = null;

Defined in: packages/blockly/core/field.ts:139

The rendered field's text content element.

Inherited from​

FieldInput.textContent_

constants_​

protected constants_:
| ConstantProvider
| null = null;

Defined in: packages/blockly/core/field.ts:145

Constants associated with the source block's renderer.

Inherited from​

FieldInput.constants_

maxDisplayLength​

maxDisplayLength: number = 50;

Defined in: packages/blockly/core/field.ts:155

Maximum characters of text to display before adding an ellipsis.

Inherited from​

FieldInput.maxDisplayLength

sourceBlock_​

protected sourceBlock_: Block | null = null;

Defined in: packages/blockly/core/field.ts:158

Block this field is attached to. Starts as null, then set in init.

Inherited from​

FieldInput.sourceBlock_

isDirty_​

protected isDirty_: boolean = true;

Defined in: packages/blockly/core/field.ts:161

Does this block need to be re-rendered?

Inherited from​

FieldInput.isDirty_

visible_​

protected visible_: boolean = true;

Defined in: packages/blockly/core/field.ts:164

Is the field visible, or hidden due to the block being collapsed?

Inherited from​

FieldInput.visible_

enabled_​

protected enabled_: boolean = true;

Defined in: packages/blockly/core/field.ts:169

Can the field value be changed using the editor on an editable block?

Inherited from​

FieldInput.enabled_

clickTarget_​

protected clickTarget_: Element | null = null;

Defined in: packages/blockly/core/field.ts:172

The element the click handler is bound to.

Inherited from​

FieldInput.clickTarget_

EDITABLE​

EDITABLE: boolean = true;

Defined in: packages/blockly/core/field.ts:192

Editable fields usually show some sort of UI indicating they are editable. They will also be saved by the serializer.

Inherited from​

FieldInput.EDITABLE

BORDERRADIUS​

static BORDERRADIUS: number = 4;

Defined in: packages/blockly/core/field_input.ts:65

Pixel size of input border radius. Should match blocklyText's border-radius in CSS.

Inherited from​

FieldInput.BORDERRADIUS

spellcheck_​

protected spellcheck_: boolean = true;

Defined in: packages/blockly/core/field_input.ts:68

Allow browser to spellcheck this field.

Inherited from​

FieldInput.spellcheck_

htmlInput_​

protected htmlInput_: HTMLInputElement | null = null;

Defined in: packages/blockly/core/field_input.ts:71

The HTML input element.

Inherited from​

FieldInput.htmlInput_

isBeingEdited_​

protected isBeingEdited_: boolean = false;

Defined in: packages/blockly/core/field_input.ts:74

True if the field's value is currently being edited via the UI.

Inherited from​

FieldInput.isBeingEdited_

isTextValid_​

protected isTextValid_: boolean = false;

Defined in: packages/blockly/core/field_input.ts:79

True if the value currently displayed in the field's editory UI is valid.

Inherited from​

FieldInput.isTextValid_

warningIcon​

protected warningIcon: SVGElement | null = null;

Defined in: packages/blockly/core/field_input.ts:84

The warning icon to display on invalid input

Inherited from​

FieldInput.warningIcon

valueWhenEditorWasOpened_​

protected valueWhenEditorWasOpened_: string | null = null;

Defined in: packages/blockly/core/field_input.ts:91

The intial value of the field when the user opened an editor to change its value. When the editor is disposed, an event will be fired that uses this as the event's oldValue.

Inherited from​

FieldInput.valueWhenEditorWasOpened_

fullBlockClickTarget_​

fullBlockClickTarget_: boolean = false;

Defined in: packages/blockly/core/field_input.ts:103

Whether the field should consider the whole parent block to be its click target.

Inherited from​

FieldInput.fullBlockClickTarget_

workspace_​

protected workspace_: WorkspaceSvg | null = null;

Defined in: packages/blockly/core/field_input.ts:106

The workspace that this field belongs to.

Inherited from​

FieldInput.workspace_

SERIALIZABLE​

SERIALIZABLE: boolean = true;

Defined in: packages/blockly/core/field_input.ts:112

Serializable fields are saved by the serializer, non-serializable fields are not. Editable fields should also be serializable.

Inherited from​

FieldInput.SERIALIZABLE

Accessors​

size_​

Get Signature​

get protected size_(): Size;

Defined in: packages/blockly/core/field_input.ts:123

Returns the size of this field, with a minimum width of 14.

Returns​

Size

Set Signature​

set protected size_(newValue): void;

Defined in: packages/blockly/core/field_input.ts:114

Gets the size of this field. Because getSize() and updateSize() have side effects, this acts as a shim for subclasses which wish to adjust field bounds when setting/getting the size without triggering unwanted rendering or other side effects. Note that subclasses must override both get and set if either is overridden; the implementation may just call directly through to super, but it must exist per the JS spec.

Parameters​
ParameterType
newValueSize
Returns​

void

Inherited from​

FieldInput.size_

Methods​

setSourceBlock()​

setSourceBlock(block): void;

Defined in: packages/blockly/core/field.ts:266

Attach this field to a block.

Parameters​

ParameterTypeDescription
blockBlockThe block containing this field.

Returns​

void

Inherited from​

FieldInput.setSourceBlock

getConstants()​

getConstants():
| ConstantProvider
| null;

Defined in: packages/blockly/core/field.ts:284

Get the renderer constant provider.

Returns​

| ConstantProvider | null

The renderer constant provider.

Inherited from​

FieldInput.getConstants

getSourceBlock()​

getSourceBlock(): Block | null;

Defined in: packages/blockly/core/field.ts:304

Get the block this field is attached to.

Returns​

Block | null

The block containing this field.

Throws​

An error if the source block is not defined.

Inherited from​

FieldInput.getSourceBlock

setAriaTypeName()​

setAriaTypeName(ariaTypeName): void;

Defined in: packages/blockly/core/field.ts:332

Sets the ARIA-friendly label representation of this field's type.

Implementations are responsible for, and encouraged to, set a localized version of the ARIA representation of the field's type. To that end, the provided value may contain message references of the form %{BKY_...} (e.g. %{BKY_MY_FIELD_ARIA_TYPE}), which are replaced with the corresponding Blockly.Msg value.

Parameters​

ParameterTypeDescription
ariaTypeNamestringAn ARIA representation of the field's type.

Returns​

void

Inherited from​

FieldInput.setAriaTypeName

computeAriaLabel()​

computeAriaLabel(includeTypeInfo?): string;

Defined in: packages/blockly/core/field.ts:391

Computes a descriptive ARIA label to represent this field with configurable verbosity.

A 'verbose' label includes type information, if available, whereas a non-verbose label only contains the field's value.

Note that this will always return the latest representation of the field's label which may differ from any previously set ARIA label for the field itself. Implementations are largely responsible for ensuring that the field's ARIA label is set correctly at relevant moments in the field's lifecycle (such as when its value changes).

Finally, it is never guaranteed that implementations use the label returned by this method for their actual ARIA label. Some implementations may rely on other contexts to convey information like the field's value. Example: checkboxes represent their checked/non-checked status (i.e. value) through a separate ARIA property.

If the field's value is empty then it will return a localized placeholder indicating that its value is empty. If this method returns an empty string, the output will be ignored when composing the block-level ARIA label. Make sure you want your label hidden from screenreaders before returning an empty string.

Parameters​

ParameterTypeDefault valueDescription
includeTypeInfobooleantrueWhether to include the field's type information in the returned label, if available.

Returns​

string

Inherited from​

FieldInput.computeAriaLabel

initModel()​

initModel(): void;

Defined in: packages/blockly/core/field.ts:454

Initializes the model of the field after it has been installed on a block. No-op by default.

Returns​

void

Inherited from​

FieldInput.initModel

createBorderRect_()​

protected createBorderRect_(): void;

Defined in: packages/blockly/core/field.ts:489

Create a field border rect element. Not to be overridden by subclasses. Instead modify the result of the function inside initView, or create a separate function to call.

Returns​

void

Inherited from​

FieldInput.createBorderRect_

createTextElement_()​

protected createTextElement_(): void;

Defined in: packages/blockly/core/field.ts:512

Create a field text element. Not to be overridden by subclasses. Instead, modify the result of the function inside initView, or create a separate function to call. Aria state is hidden; use the aria label for the field and/or containing block to expose content to screen readers. Text content for custom blocks can be set after creation.

Returns​

void

Inherited from​

FieldInput.createTextElement_

bindEvents_()​

protected bindEvents_(): void;

Defined in: packages/blockly/core/field.ts:532

Bind events to the field. Can be overridden by subclasses if they need to do custom input handling.

Returns​

void

Inherited from​

FieldInput.bindEvents_

fromXml()​

fromXml(fieldElement): void;

Defined in: packages/blockly/core/field.ts:550

Sets the field's value based on the given XML element. Should only be called by Blockly.Xml.

Parameters​

ParameterTypeDescription
fieldElementElementThe element containing info about the field's state.

Returns​

void

Inherited from​

FieldInput.fromXml

toXml()​

toXml(fieldElement): Element;

Defined in: packages/blockly/core/field.ts:562

Serializes this field's value to XML. Should only be called by Blockly.Xml.

Parameters​

ParameterTypeDescription
fieldElementElementThe element to populate with info about the field's state.

Returns​

Element

The element containing info about the field's state.

Inherited from​

FieldInput.toXml

saveState()​

saveState(_doFullSerialization?): any;

Defined in: packages/blockly/core/field.ts:580

Saves this fields value as something which can be serialized to JSON. Should only be called by the serialization system.

Parameters​

ParameterTypeDescription
_doFullSerialization?booleanIf true, this signals to the field that if it normally just saves a reference to some state (eg variable fields) it should instead serialize the full state of the thing being referenced. See the field serialization docs for more information.

Returns​

any

JSON serializable state.

Inherited from​

FieldInput.saveState

loadState()​

loadState(state): void;

Defined in: packages/blockly/core/field.ts:594

Sets the field's state based on the given state value. Should only be called by the serialization system.

Parameters​

ParameterTypeDescription
stateanyThe state we want to apply to the field.

Returns​

void

Inherited from​

FieldInput.loadState

saveLegacyState()​

protected saveLegacyState(callingClass): string | null;

Defined in: packages/blockly/core/field.ts:610

Returns a stringified version of the XML state, if it should be used. Otherwise this returns null, to signal the field should use its own serialization.

Parameters​

ParameterTypeDescription
callingClassFieldProtoThe class calling this method. Used to see if this has overridden any relevant hooks.

Returns​

string | null

The stringified version of the XML state, or null.

Inherited from​

FieldInput.saveLegacyState

loadLegacyState()​

loadLegacyState(callingClass, state): boolean;

Defined in: packages/blockly/core/field.ts:637

Loads the given state using either the old XML hooks, if they should be used. Returns true to indicate loading has been handled, false otherwise.

Parameters​

ParameterTypeDescription
callingClassFieldProtoThe class calling this method. Used to see if this has overridden any relevant hooks.
stateanyThe state to apply to the field.

Returns​

boolean

Whether the state was applied or not.

Inherited from​

FieldInput.loadLegacyState

dispose()​

dispose(): void;

Defined in: packages/blockly/core/field.ts:656

Dispose of all DOM objects and events belonging to this editable field.

Returns​

void

Inherited from​

FieldInput.dispose

updateEditable()​

updateEditable(): void;

Defined in: packages/blockly/core/field.ts:675

Add or remove the UI indicating if this field is editable or not.

Returns​

void

Inherited from​

FieldInput.updateEditable

setEnabled()​

setEnabled(enabled): void;

Defined in: packages/blockly/core/field.ts:696

Set whether this field's value can be changed using the editor when the source block is editable.

Parameters​

ParameterTypeDescription
enabledbooleanTrue if enabled.

Returns​

void

Inherited from​

FieldInput.setEnabled

isEnabled()​

isEnabled(): boolean;

Defined in: packages/blockly/core/field.ts:707

Check whether this field's value can be changed using the editor when the source block is editable.

Returns​

boolean

Whether this field is enabled.

Inherited from​

FieldInput.isEnabled

isClickable()​

isClickable(): boolean;

Defined in: packages/blockly/core/field.ts:716

Check whether this field defines the showEditor_ function.

Returns​

boolean

Whether this field is clickable.

Inherited from​

FieldInput.isClickable

isClickableInFlyout()​

isClickableInFlyout(autoClosingFlyout): boolean;

Defined in: packages/blockly/core/field.ts:735

Check whether the field should be clickable while the block is in a flyout. The default is that fields are clickable in always-open flyouts such as the simple toolbox, but not in autoclosing flyouts such as the category toolbox. Subclasses may override this function to change this behavior. Note that isClickable must also return true for this to have any effect.

Parameters​

ParameterTypeDescription
autoClosingFlyoutbooleantrue if the containing flyout is an auto-closing one.

Returns​

boolean

Whether the field should be clickable while the block is in a flyout.

Inherited from​

FieldInput.isClickableInFlyout

isCurrentlyEditable()​

isCurrentlyEditable(): boolean;

Defined in: packages/blockly/core/field.ts:747

Check whether this field is currently editable. Some fields are never EDITABLE (e.g. text labels). Other fields may be EDITABLE but may exist on non-editable blocks or be currently disabled.

Returns​

boolean

Whether this field is currently enabled, editable and on an editable block.

Inherited from​

FieldInput.isCurrentlyEditable

isSerializable()​

isSerializable(): boolean;

Defined in: packages/blockly/core/field.ts:762

Check whether this field should be serialized by the XML renderer. Handles the logic for backwards compatibility and incongruous states.

Returns​

boolean

Whether this field should be serialized or not.

Inherited from​

FieldInput.isSerializable

isVisible()​

isVisible(): boolean;

Defined in: packages/blockly/core/field.ts:784

Gets whether this editable field is visible or not.

Returns​

boolean

True if visible.

Inherited from​

FieldInput.isVisible

setValidator()​

setValidator(handler): void;

Defined in: packages/blockly/core/field.ts:821

Sets a new validation function for editable fields, or clears a previously set validator.

The validator function takes in the new field value, and returns validated value. The validated value could be the input value, a modified version of the input value, or null to abort the change.

If the function does not return anything (or returns undefined) the new value is accepted as valid. This is to allow for fields using the validated function as a field-level change event notification.

Parameters​

ParameterTypeDescription
handlerFieldValidator<string>The validator function or null to clear a previous validator.

Returns​

void

Inherited from​

FieldInput.setValidator

getValidator()​

getValidator():
| FieldValidator<string>
| null;

Defined in: packages/blockly/core/field.ts:830

Gets the validation function for editable fields, or null if not set.

Returns​

| FieldValidator<string> | null

Validation function, or null.

Inherited from​

FieldInput.getValidator

getSvgRoot()​

getSvgRoot(): SVGGElement | null;

Defined in: packages/blockly/core/field.ts:840

Gets the group element for this editable field. Used for measuring the size and for positioning.

Returns​

SVGGElement | null

The group element.

Inherited from​

FieldInput.getSvgRoot

getBorderRect()​

protected getBorderRect(): SVGRectElement;

Defined in: packages/blockly/core/field.ts:850

Gets the border rectangle element.

Returns​

SVGRectElement

The border rectangle element.

Throws​

An error if the border rectangle element is not defined.

Inherited from​

FieldInput.getBorderRect

getTextElement()​

protected getTextElement(): SVGTextElement;

Defined in: packages/blockly/core/field.ts:863

Gets the text element.

Returns​

SVGTextElement

The text element.

Throws​

An error if the text element is not defined.

Inherited from​

FieldInput.getTextElement

getTextContent()​

protected getTextContent(): Text;

Defined in: packages/blockly/core/field.ts:876

Gets the text content.

Returns​

Text

The text content.

Throws​

An error if the text content is not defined.

Inherited from​

FieldInput.getTextContent

updateSize_()​

protected updateSize_(margin?): void;

Defined in: packages/blockly/core/field.ts:962

Updates the size of the field based on the text.

Parameters​

ParameterTypeDescription
margin?numbermargin to use when positioning the text element.

Returns​

void

Inherited from​

FieldInput.updateSize_

positionBorderRect_()​

protected positionBorderRect_(): void;

Defined in: packages/blockly/core/field.ts:1023

Position a field's border rect after a size change.

Returns​

void

Inherited from​

FieldInput.positionBorderRect_

getDisplayText_()​

protected getDisplayText_(): string;

Defined in: packages/blockly/core/field.ts:1115

Get the text from this field to display on the block. May differ from getText due to ellipsis, and other formatting.

Returns​

string

Text to display.

Inherited from​

FieldInput.getDisplayText_

getText()​

getText(): string;

Defined in: packages/blockly/core/field.ts:1138

Sealed

Get the text from this field. Override getText_ to provide a different behavior than simply casting the value to a string.

Returns​

string

Current text.

Inherited from​

FieldInput.getText

forceRerender()​

forceRerender(): void;

Defined in: packages/blockly/core/field.ts:1179

Force a rerender of the block that this field is installed on, which will rerender this field and adjust for any sizing changes. Other fields on the same block will not rerender, because their sizes have already been recorded.

Returns​

void

Inherited from​

FieldInput.forceRerender

setValue()​

setValue(newValue, fireChangeEvent?): void;

Defined in: packages/blockly/core/field.ts:1197

Sealed

Used to change the value of the field. Handles validation and events. Subclasses should override doClassValidation_ and doValueUpdate_ rather than this method.

Parameters​

ParameterTypeDefault valueDescription
newValueanyundefinedNew value.
fireChangeEventbooleantrueWhether to fire a change event. Defaults to true. Should usually be true unless the change will be reported some other way, e.g. an intermediate field change event.

Returns​

void

Inherited from​

FieldInput.setValue

getValue()​

getValue(): string | null;

Defined in: packages/blockly/core/field.ts:1297

Get the current value of the field.

Returns​

string | null

Current value.

Inherited from​

FieldInput.getValue

onMouseDown_()​

protected onMouseDown_(e): void;

Defined in: packages/blockly/core/field.ts:1363

Handle a pointerdown event on a field.

Parameters​

ParameterTypeDescription
ePointerEventPointer down event.

Returns​

void

Inherited from​

FieldInput.onMouseDown_

setTooltip()​

setTooltip(newTip): void;

Defined in: packages/blockly/core/field.ts:1381

Sets the tooltip for this field.

Parameters​

ParameterTypeDescription
newTipTipInfo | nullThe text for the tooltip, a function that returns the text for the tooltip, a parent object whose tooltip will be used, or null to display the tooltip of the parent block. To not display a tooltip pass the empty string.

Returns​

void

Inherited from​

FieldInput.setTooltip

getTooltip()​

getTooltip(): string;

Defined in: packages/blockly/core/field.ts:1400

Returns the tooltip text for this field.

Returns​

string

The tooltip text for this field.

Inherited from​

FieldInput.getTooltip

getClickTarget_()​

protected getClickTarget_(): Element | null;

Defined in: packages/blockly/core/field.ts:1416

The element to bind the click handler to. If not set explicitly, defaults to the SVG root of the field. When this element is clicked on an editable field, the editor will open.

Returns​

Element | null

Element to bind click handler to.

Inherited from​

FieldInput.getClickTarget_

getAbsoluteXY_()​

protected getAbsoluteXY_(): Coordinate;

Defined in: packages/blockly/core/field.ts:1426

Return the absolute coordinates of the top-left corner of this field. The origin (0,0) is the top-left corner of the page body.

Returns​

Coordinate

Object with .x and .y properties.

Inherited from​

FieldInput.getAbsoluteXY_

referencesVariables()​

referencesVariables(): boolean;

Defined in: packages/blockly/core/field.ts:1437

Whether this field references any Blockly variables. If true it may need to be handled differently during serialization and deserialization. Subclasses may override this.

Returns​

boolean

True if this field has any variable references.

Inherited from​

FieldInput.referencesVariables

refreshVariableName()​

refreshVariableName(): void;

Defined in: packages/blockly/core/field.ts:1445

Refresh the variable name referenced by this field if this field references variables.

Returns​

void

Inherited from​

FieldInput.refreshVariableName

getFlipRtl()​

getFlipRtl(): boolean;

Defined in: packages/blockly/core/field.ts:1481

Returns whether or not we should flip the field in RTL.

Returns​

boolean

True if we should flip in RTL.

Inherited from​

FieldInput.getFlipRtl

onShortcut()​

onShortcut(_shortcut): boolean;

Defined in: packages/blockly/core/field.ts:1491

Handles the given keyboard shortcut.

Parameters​

ParameterTypeDescription
_shortcutKeyboardShortcutThe shortcut to be handled.

Returns​

boolean

True if the shortcut has been handled, false otherwise.

Inherited from​

FieldInput.onShortcut

getFocusableElement()​

getFocusableElement(): HTMLElement | SVGElement;

Defined in: packages/blockly/core/field.ts:1496

See IFocusableNode.getFocusableElement.

Returns​

HTMLElement | SVGElement

Inherited from​

FieldInput.getFocusableElement

getFocusableTree()​

getFocusableTree(): IFocusableTree;

Defined in: packages/blockly/core/field.ts:1504

See IFocusableNode.getFocusableTree.

Returns​

IFocusableTree

Inherited from​

FieldInput.getFocusableTree

onNodeFocus()​

onNodeFocus(): void;

Defined in: packages/blockly/core/field.ts:1513

See IFocusableNode.onNodeFocus.

Returns​

void

Inherited from​

FieldInput.onNodeFocus

onNodeBlur()​

onNodeBlur(): void;

Defined in: packages/blockly/core/field.ts:1521

See IFocusableNode.onNodeBlur.

Returns​

void

Inherited from​

FieldInput.onNodeBlur

canBeFocused()​

canBeFocused(): boolean;

Defined in: packages/blockly/core/field.ts:1524

See IFocusableNode.canBeFocused.

Returns​

boolean

Inherited from​

FieldInput.canBeFocused

performAction()​

performAction(): void;

Defined in: packages/blockly/core/field.ts:1532

Handles the user acting on this field via keyboard navigation. Shows and focuses the field editor.

Returns​

void

Inherited from​

FieldInput.performAction

configure_()​

protected configure_(config): void;

Defined in: packages/blockly/core/field_input.ts:163

Process the configuration map passed to the field.

Parameters​

ParameterTypeDescription
configFieldInputConfigA map of options used to configure the field. See the individual field's documentation for a list of properties this parameter supports.

Returns​

void

Inherited from​

FieldInput.configure_

isFullBlockField()​

isFullBlockField(): boolean;

Defined in: packages/blockly/core/field_input.ts:193

Defines whether this field should take up the full block or not.

This is typically only done for certain kinds of fields and in certain renderers. You should only override this if you're sure your field will render correctly in zelos and other renderers that support full-block fields.

Blocks that contain only a single field that is a full-block-field have a special appearance in some renderers and their behavior is unique, because we pretend that the field is a whole block in some cases. This is hacky and you should use caution when attempting to do anything with this method.

Returns​

boolean

Inherited from​

FieldInput.isFullBlockField

createWarningIcon()​

protected createWarningIcon(): SVGElement | null;

Defined in: packages/blockly/core/field_input.ts:204

Creates the DOM elements for the invalid input warning icon.

Returns​

SVGElement | null

Inherited from​

FieldInput.createWarningIcon

doValueInvalid_()​

protected doValueInvalid_(_invalidValue, fireChangeEvent?): void;

Defined in: packages/blockly/core/field_input.ts:261

Called by setValue if the text input is not valid. If the field is currently being edited it reverts value of the field to the previous value while allowing the display text to be handled by the htmlInput_.

Parameters​

ParameterTypeDefault valueDescription
_invalidValueanyundefinedThe input value that was determined to be invalid. This is not used by the text input because its display value is stored on the htmlInput_.
fireChangeEventbooleantrueWhether to fire a change event if the value changes.

Returns​

void

Inherited from​

FieldInput.doValueInvalid_

doValueUpdate_()​

protected doValueUpdate_(newValue): void;

Defined in: packages/blockly/core/field_input.ts:299

Called by setValue if the text input is valid. Updates the value of the field, and updates the text of the field if it is not currently being edited (i.e. handled by the htmlInput_).

Parameters​

ParameterTypeDescription
newValuestringThe value to be saved. The default validator guarantees that this is a string.

Returns​

void

Inherited from​

FieldInput.doValueUpdate_

applyColour()​

applyColour(): void;

Defined in: packages/blockly/core/field_input.ts:309

Updates text field to match the colour/style of the block.

Returns​

void

Inherited from​

FieldInput.applyColour

getSize()​

getSize(): Size;

Defined in: packages/blockly/core/field_input.ts:337

Returns the height and width of the field.

This should in general be the only place render_ gets called from.

Returns​

Size

Height and width.

Inherited from​

FieldInput.getSize

onLocationChange()​

onLocationChange(): void;

Defined in: packages/blockly/core/field_input.ts:355

Notifies the field that it has changed locations. Moves the widget div to be in the correct place if it is open.

Returns​

void

Inherited from​

FieldInput.onLocationChange

render_()​

protected render_(): void;

Defined in: packages/blockly/core/field_input.ts:366

Updates the colour of the htmlInput given the current validity of the field's value.

Also updates the colour of the block to reflect whether this is a full block field or not.

Returns​

void

Inherited from​

FieldInput.render_

renderWarningIcon()​

protected renderWarningIcon(rtl, isValid): void;

Defined in: packages/blockly/core/field_input.ts:393

Parameters​

ParameterType
rtlboolean
isValidboolean

Returns​

void

Inherited from​

FieldInput.renderWarningIcon

setSpellcheck()​

setSpellcheck(check): void;

Defined in: packages/blockly/core/field_input.ts:436

Set whether this field is spellchecked by the browser.

Parameters​

ParameterTypeDescription
checkbooleanTrue if checked.

Returns​

void

Inherited from​

FieldInput.setSpellcheck

showEditor_()​

protected showEditor_(
_e?,
quietInput?,
manageEphemeralFocus?
): void;

Defined in: packages/blockly/core/field_input.ts:466

Show an editor for the field. Shows the inline free-text editor on top of the text by default. Shows a prompt editor for mobile browsers if the modalInputs option is enabled.

Parameters​

ParameterTypeDefault valueDescription
_e?EventundefinedOptional mouse event that triggered the field to open, or undefined if triggered programmatically.
quietInput?booleanfalseTrue if editor should be created without focus. Defaults to false.
manageEphemeralFocus?booleantrueWhether ephemeral focus should be managed as part of the editor's inline editor (when the inline editor is shown). Callers must manage ephemeral focus themselves if this is false. Defaults to true.

Returns​

void

Inherited from​

FieldInput.showEditor_

widgetCreate_()​

protected widgetCreate_(): HTMLInputElement | HTMLTextAreaElement;

Defined in: packages/blockly/core/field_input.ts:538

Create the text input editor widget.

Returns​

HTMLInputElement | HTMLTextAreaElement

The newly created text input editor.

Inherited from​

FieldInput.widgetCreate_

widgetDispose_()​

protected widgetDispose_(): void;

Defined in: packages/blockly/core/field_input.ts:607

Closes the editor, saves the results, and disposes of any events or DOM-references belonging to the editor.

Returns​

void

Inherited from​

FieldInput.widgetDispose_

onFinishEditing_()​

onFinishEditing_(_value): void;

Defined in: packages/blockly/core/field_input.ts:661

A callback triggered when the user is done editing the field via the UI.

Parameters​

ParameterTypeDescription
_valueanyThe new value of the field.

Returns​

void

Inherited from​

FieldInput.onFinishEditing_

bindInputEvents_()​

protected bindInputEvents_(htmlInput): void;

Defined in: packages/blockly/core/field_input.ts:668

Bind handlers for user input on the text input field's editor.

Parameters​

ParameterTypeDescription
htmlInputHTMLElementThe htmlInput to which event handlers will be bound.

Returns​

void

Inherited from​

FieldInput.bindInputEvents_

unbindInputEvents_()​

protected unbindInputEvents_(): void;

Defined in: packages/blockly/core/field_input.ts:686

Unbind handlers for user input and workspace size changes.

Returns​

void

Inherited from​

FieldInput.unbindInputEvents_

onHtmlInputKeyDown_()​

protected onHtmlInputKeyDown_(e): void;

Defined in: packages/blockly/core/field_input.ts:702

Handle key down to the editor.

Parameters​

ParameterTypeDescription
eKeyboardEventKeyboard event.

Returns​

void

Inherited from​

FieldInput.onHtmlInputKeyDown_

setEditorValue_()​

protected setEditorValue_(newValue, fireChangeEvent?): void;

Defined in: packages/blockly/core/field_input.ts:799

Set the HTML input value and the field's internal value. The difference between this and setValue is that this also updates the HTML input value whilst editing.

Parameters​

ParameterTypeDefault valueDescription
newValueanyundefinedNew value.
fireChangeEventbooleantrueWhether to fire a change event. Defaults to true. Should usually be true unless the change will be reported some other way, e.g. an intermediate field change event.

Returns​

void

Inherited from​

FieldInput.setEditorValue_

resizeEditor_()​

protected resizeEditor_(): void;

Defined in: packages/blockly/core/field_input.ts:815

Resize the editor to fit the text.

Returns​

void

Inherited from​

FieldInput.resizeEditor_

repositionForWindowResize()​

repositionForWindowResize(): boolean;

Defined in: packages/blockly/core/field_input.ts:848

Handles repositioning the WidgetDiv used for input fields when the workspace is resized. Scrolls this field into view, then updates the position of the text input.

Returns​

boolean

True for rendered workspaces, as we never want to hide the widget div.

Inherited from​

FieldInput.repositionForWindowResize

positionTextElement_()​

protected positionTextElement_(xMargin, contentWidth): void;

Defined in: packages/blockly/core/field_input.ts:880

Position a field's text element after a size change. This handles both LTR and RTL positioning.

Parameters​

ParameterTypeDescription
xMarginnumberx offset to use when positioning the text element.
contentWidthnumberThe content width.

Returns​

void

Inherited from​

FieldInput.positionTextElement_

getText_()​

protected getText_(): string | null;

Defined in: packages/blockly/core/field_input.ts:898

Use the getText_ developer hook to override the field's text representation. When we're currently editing, return the current HTML value instead. Otherwise, return null which tells the field to use the default behaviour (which is a string cast of the field's value).

Returns​

string | null

The HTML value if we're editing, otherwise null.

Inherited from​

FieldInput.getText_

getEditorText_()​

protected getEditorText_(value): string;

Defined in: packages/blockly/core/field_input.ts:915

Transform the provided value into a text to show in the HTML input. Override this method if the field's HTML input representation is different than the field's value. This should be coupled with an override of getValueFromEditorText_.

Parameters​

ParameterTypeDescription
valueanyThe value stored in this field.

Returns​

string

The text to show on the HTML input.

Inherited from​

FieldInput.getEditorText_

getValueFromEditorText_()​

protected getValueFromEditorText_(text): any;

Defined in: packages/blockly/core/field_input.ts:929

Transform the text received from the HTML input into a value to store in this field. Override this method if the field's HTML input representation is different than the field's value. This should be coupled with an override of getEditorText_.

Parameters​

ParameterTypeDescription
textstringText received from the HTML input.

Returns​

any

The value to store.

Inherited from​

FieldInput.getValueFromEditorText_

getAriaValue()​

getAriaValue(): string | null;

Defined in: packages/blockly/core/field_input.ts:954

Gets an ARIA-friendly label representation of this field's value.

Implementations are responsible for, and encouraged to, return a localized version of the ARIA representation of the field's value.

Returns​

string | null

An ARIA representation of the field's text.

Inherited from​

FieldInput.getAriaValue

recomputeAriaContext()​

recomputeAriaContext(): boolean;

Defined in: packages/blockly/core/field_input.ts:961

Customizes the label for this field to include "editable" if it applies.

Returns​

boolean

Inherited from​

FieldInput.recomputeAriaContext

initView()​

initView(): void;

Defined in: packages/blockly/core/field_textinput.ts:48

Returns​

void

Overrides​

FieldInput.initView

doClassValidation_()​

protected doClassValidation_(newValue?): string | null;

Defined in: packages/blockly/core/field_textinput.ts:61

Ensure that the input value casts to a valid string.

Parameters​

ParameterTypeDescription
newValue?anyThe input value.

Returns​

string | null

A valid string, or null if invalid.

Overrides​

FieldInput.doClassValidation_

getAriaTypeName()​

getAriaTypeName(): string | null;

Defined in: packages/blockly/core/field_textinput.ts:97

Gets an ARIA-friendly label representation of this field's type.

Implementations are responsible for, and encouraged to, return a localized version of the ARIA representation of the field's type.

Returns​

string | null

An ARIA representation of the field's type or a default if it is unspecified.

Overrides​

FieldInput.getAriaTypeName