5. Component Management
These functions let you read and write component properties at runtime, enabling dynamic UI behaviour such as loading states, toggling form modes, and swapping icons.
context.getComponentByName(componentID)
sync· returnsobject
Retrieves the full props object of a component by its Component ID. Use this to read a component's current state before deciding how to update it.
Prop
Type
var formProps = context.getComponentByName("formOffer");
var isDisabled = formProps.props.disableForm;
console.log("Form is currently disabled:", isDisabled);
Returned value — the component's full configuration object. The custom props you set are under .props:
{
"key": "formOffer",
"props": {
"disableForm": false,
"hideButtons": false,
"inline": true
}
}
Call console.log(context.getComponentByName("myComponent")) and open your browser's DevTools console to explore all available props for any component.
context.updateComponentByName(componentID, prop, value)
sync· returnsvoid
Updates a single prop on a component by its Component ID. Changes take effect immediately in the UI.
Prop
Type
context.updateComponentByName("btnEdit", "loading", true);
var formProps = context.getComponentByName("formOffer");
var disableForm = formProps.props.disableForm;
if (disableForm == false) {
context.updateComponentByName("formOffer", "disableForm", true);
context.updateComponentByName("formOffer", "hideButtons", true);
context.updateComponentByName("btnEdit", "icon", "CheckOutlined");
context.toast.success("Edit mode off.");
} else {
context.updateComponentByName("formOffer", "disableForm", false);
context.updateComponentByName("formOffer", "hideButtons", false);
context.updateComponentByName("btnEdit", "icon", "LockOutlined");
context.toast.success("Edit mode on.");
}
context.updateComponentByName("btnEdit", "loading", false);
Setting loading: true on a button at the start of an async function and loading: false at the end is the standard pattern for giving users visual feedback that an action is in progress.
context.updateComponentByKey(key, prop, value [, save])
sync· returnsvoid
Like updateComponentByName but targets a component by its internal key rather than its Component ID. Optionally persists the change.
Prop
Type
context.updateComponentByKey("comp_abc123", "visible", false, true);
context.updateComponentState(name, prop, value)
sync· returnsvoid
Updates a component's local state rather than its configuration props. Use this for transient UI state that should not be persisted (e.g. toggling a panel open/closed).
Prop
Type
context.updateComponentState("panelFilters", "collapsed", true);
context.getComponentPropByName(name, prop)
sync· returnsany
Returns the current value of a single prop on a component without fetching the full props object. Useful when you only need one value.
Prop
Type
var isDisabled = context.getComponentPropByName("formOffer", "disableForm");
Returned value — the raw value of the requested prop:
false