Class: FieldTextInput
Defined in: packages/blockly/core/field_textinput.ts:28
Class for an editable text field.
Extends
FieldInput<string>
Properties index
| Property | Description |
|---|---|
| DEFAULT_VALUE | To overwrite the default value which is set in Field, directly update the prototype. |
| NBSP | Non-breaking space. |
| SKIP_SETUP | 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. |
| name | Name of field. Unique within each block. Static labels are usually unnamed. |
| value_ | - |
| validator_ | Validation function called when user edits an editable field. |
| ariaTypeName | The 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. |
| maxDisplayLength | Maximum 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. |
| EDITABLE | Editable fields usually show some sort of UI indicating they are editable. They will also be saved by the serializer. |
| BORDERRADIUS | Pixel 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. |
| warningIcon | The 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. |
| SERIALIZABLE | Serializable fields are saved by the serializer, non-serializable fields are not. Editable fields should also be serializable. |
Methods index
| Method | Description |
|---|---|
| setSourceBlock | Attach this field to a block. |
| getConstants | Get the renderer constant provider. |
| getSourceBlock | Get the block this field is attached to. |
| setAriaTypeName | Sets the ARIA-friendly label representation of this field's type. |
| computeAriaLabel | Computes a descriptive ARIA label to represent this field with configurable verbosity. |
| initModel | Initializes 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. |
| fromXml | Sets the field's value based on the given XML element. Should only be called by Blockly.Xml. |
| toXml | Serializes this field's value to XML. Should only be called by Blockly.Xml. |
| saveState | Saves this fields value as something which can be serialized to JSON. Should only be called by the serialization system. |
| loadState | Sets the field's state based on the given state value. Should only be called by the serialization system. |
| saveLegacyState | 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. |
| loadLegacyState | 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. |
| dispose | Dispose of all DOM objects and events belonging to this editable field. |
| updateEditable | Add or remove the UI indicating if this field is editable or not. |
| setEnabled | Set whether this field's value can be changed using the editor when the source block is editable. |
| isEnabled | Check whether this field's value can be changed using the editor when the source block is editable. |
| isClickable | Check whether this field defines the showEditor_ function. |
| isClickableInFlyout | 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. |
| isCurrentlyEditable | 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. |
| isSerializable | Check whether this field should be serialized by the XML renderer. Handles the logic for backwards compatibility and incongruous states. |
| isVisible | Gets whether this editable field is visible or not. |
| setValidator | Sets a new validation function for editable fields, or clears a previously set validator. |
| getValidator | Gets the validation function for editable fields, or null if not set. |
| getSvgRoot | Gets the group element for this editable field. Used for measuring the size and for positioning. |
| getBorderRect | Gets the border rectangle element. |
| getTextElement | Gets the text element. |
| getTextContent | Gets 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. |
| getText | Get the text from this field. Override getText_ to provide a different behavior than simply casting the value to a string. |
| forceRerender | 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. |
| setValue | Used to change the value of the field. Handles validation and events. Subclasses should override doClassValidation_ and doValueUpdate_ rather than this method. |
| getValue | Get the current value of the field. |
| onMouseDown_ | Handle a pointerdown event on a field. |
| setTooltip | Sets the tooltip for this field. |
| getTooltip | Returns 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. |
| referencesVariables | Whether this field references any Blockly variables. If true it may need to be handled differently during serialization and deserialization. Subclasses may override this. |
| refreshVariableName | Refresh the variable name referenced by this field if this field references variables. |
| getFlipRtl | Returns whether or not we should flip the field in RTL. |
| onShortcut | Handles the given keyboard shortcut. |
| getFocusableElement | See IFocusableNode.getFocusableElement. |
| getFocusableTree | See IFocusableNode.getFocusableTree. |
| onNodeFocus | See IFocusableNode.onNodeFocus. |
| onNodeBlur | See IFocusableNode.onNodeBlur. |
| canBeFocused | See IFocusableNode.canBeFocused. |
| performAction | Handles the user acting on this field via keyboard navigation. Shows and focuses the field editor. |
| configure_ | Process the configuration map passed to the field. |
| isFullBlockField | Defines whether this field should take up the full block or not. |
| createWarningIcon | Creates 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_). |
| applyColour | Updates text field to match the colour/style of the block. |
| getSize | Returns the height and width of the field. |
| onLocationChange | Notifies 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 | - |
| setSpellcheck | Set 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. |
| repositionForWindowResize | 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. |
| 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_. |
| getAriaValue | Gets an ARIA-friendly label representation of this field's value. |
| recomputeAriaContext | Customizes the label for this field to include "editable" if it applies. |
| initView | - |
| doClassValidation_ | Ensure that the input value casts to a valid string. |
| getAriaTypeName | Gets 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:43
Parameters
| Parameter | Type | Description |
|---|---|---|
value? | string | typeof SKIP_SETUP | The 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 | null | A 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? | FieldInputConfig | A 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:68
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:71
Allow browser to spellcheck this field.
Inherited from
FieldInput.spellcheck_
htmlInput_
protected htmlInput_: HTMLInputElement | null = null;
Defined in: packages/blockly/core/field_input.ts:74
The HTML input element.
Inherited from
FieldInput.htmlInput_
isBeingEdited_
protected isBeingEdited_: boolean = false;
Defined in: packages/blockly/core/field_input.ts:77
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:82
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:87
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:94
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:106
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:109
The workspace that this field belongs to.
Inherited from
FieldInput.workspace_
SERIALIZABLE
SERIALIZABLE: boolean = true;
Defined in: packages/blockly/core/field_input.ts:115
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:126
Returns the size of this field, with a minimum width of 14.
Returns
Set Signature
set protected size_(newValue): void;
Defined in: packages/blockly/core/field_input.ts:117
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
| Parameter | Type |
|---|---|
newValue | Size |
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
| Parameter | Type | Description |
|---|---|---|
block | Block | The 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
| Parameter | Type | Description |
|---|---|---|
ariaTypeName | string | An 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
| Parameter | Type | Default value | Description |
|---|---|---|---|
includeTypeInfo | boolean | true | Whether 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
| Parameter | Type | Description |
|---|---|---|
fieldElement | Element | The 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
| Parameter | Type | Description |
|---|---|---|
fieldElement | Element | The 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
| Parameter | Type | Description |
|---|---|---|
_doFullSerialization? | boolean | If 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
| Parameter | Type | Description |
|---|---|---|
state | any | The 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
| Parameter | Type | Description |
|---|---|---|
callingClass | FieldProto | The 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
| Parameter | Type | Description |
|---|---|---|
callingClass | FieldProto | The class calling this method. Used to see if this has overridden any relevant hooks. |
state | any | The 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
| Parameter | Type | Description |
|---|---|---|
enabled | boolean | True 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
| Parameter | Type | Description |
|---|---|---|
autoClosingFlyout | boolean | true 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
| Parameter | Type | Description |
|---|---|---|
handler | FieldValidator<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
| Parameter | Type | Description |
|---|---|---|
margin? | number | margin 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
| Parameter | Type | Default value | Description |
|---|---|---|---|
newValue | any | undefined | New value. |
fireChangeEvent | boolean | true | Whether 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
| Parameter | Type | Description |
|---|---|---|
e | PointerEvent | Pointer 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
| Parameter | Type | Description |
|---|---|---|
newTip | TipInfo | null | The 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
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
| Parameter | Type | Description |
|---|---|---|
_shortcut | KeyboardShortcut | The 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
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:166
Process the configuration map passed to the field.
Parameters
| Parameter | Type | Description |
|---|---|---|
config | FieldInputConfig | A 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:196
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:207
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:264
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
| Parameter | Type | Default value | Description |
|---|---|---|---|
_invalidValue | any | undefined | The 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_. |
fireChangeEvent | boolean | true | Whether 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:302
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
| Parameter | Type | Description |
|---|---|---|
newValue | string | The 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:312
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:340
Returns the height and width of the field.
This should in general be the only place render_ gets called from.
Returns
Height and width.
Inherited from
FieldInput.getSize
onLocationChange()
onLocationChange(): void;
Defined in: packages/blockly/core/field_input.ts:358
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:369
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:396
Parameters
| Parameter | Type |
|---|---|
rtl | boolean |
isValid | boolean |
Returns
void
Inherited from
FieldInput.renderWarningIcon
setSpellcheck()
setSpellcheck(check): void;
Defined in: packages/blockly/core/field_input.ts:439
Set whether this field is spellchecked by the browser.
Parameters
| Parameter | Type | Description |
|---|---|---|
check | boolean | True if checked. |
Returns
void
Inherited from
FieldInput.setSpellcheck
showEditor_()
protected showEditor_(
_e?,
quietInput?,
manageEphemeralFocus?
): void;
Defined in: packages/blockly/core/field_input.ts:469
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
| Parameter | Type | Default value | Description |
|---|---|---|---|
_e? | Event | undefined | Optional mouse event that triggered the field to open, or undefined if triggered programmatically. |
quietInput? | boolean | false | True if editor should be created without focus. Defaults to false. |
manageEphemeralFocus? | boolean | true | Whether 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:541
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:610
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:664
A callback triggered when the user is done editing the field via the UI.
Parameters
| Parameter | Type | Description |
|---|---|---|
_value | any | The new value of the field. |
Returns
void
Inherited from
FieldInput.onFinishEditing_
bindInputEvents_()
protected bindInputEvents_(htmlInput): void;
Defined in: packages/blockly/core/field_input.ts:671
Bind handlers for user input on the text input field's editor.
Parameters
| Parameter | Type | Description |
|---|---|---|
htmlInput | HTMLElement | The 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:689
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:705
Handle key down to the editor.
Parameters
| Parameter | Type | Description |
|---|---|---|
e | KeyboardEvent | Keyboard event. |
Returns
void
Inherited from
FieldInput.onHtmlInputKeyDown_
setEditorValue_()
protected setEditorValue_(newValue, fireChangeEvent?): void;
Defined in: packages/blockly/core/field_input.ts:802
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
| Parameter | Type | Default value | Description |
|---|---|---|---|
newValue | any | undefined | New value. |
fireChangeEvent | boolean | true | Whether 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:818
Resize the editor to fit the text.
Returns
void
Inherited from
FieldInput.resizeEditor_
repositionForWindowResize()
repositionForWindowResize(): boolean;
Defined in: packages/blockly/core/field_input.ts:853
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:885
Position a field's text element after a size change. This handles both LTR and RTL positioning.
Parameters
| Parameter | Type | Description |
|---|---|---|
xMargin | number | x offset to use when positioning the text element. |
contentWidth | number | The content width. |
Returns
void
Inherited from
FieldInput.positionTextElement_
getText_()
protected getText_(): string | null;
Defined in: packages/blockly/core/field_input.ts:903
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:920
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
| Parameter | Type | Description |
|---|---|---|
value | any | The 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:934
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
| Parameter | Type | Description |
|---|---|---|
text | string | Text 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:959
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:966
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:51
Returns
void
Overrides
FieldInput.initView
doClassValidation_()
protected doClassValidation_(newValue?): string | null;
Defined in: packages/blockly/core/field_textinput.ts:64
Ensure that the input value casts to a valid string.
Parameters
| Parameter | Type | Description |
|---|---|---|
newValue? | any | The 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:100
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