Skip to content

@serenity-is/corelib / PropertyGrid

Class: PropertyGrid<P>

Defined in: src/ui/widgets/propertygrid.tsx:409

A widget that renders a set of PropertyItems as a form, organizing them into categories and/or tabs, and manages loading/saving values to and from the underlying editors.

Extends

Type Parameters

P

P extends PropertyGridOptions = PropertyGridOptions

Widget props type, constrained to PropertyGridOptions.

Constructors

Constructor

new PropertyGrid<P>(props): PropertyGrid<P>

Defined in: src/ui/widgets/widget.ts:31

Creates a widget bound to the given props, resolving the DOM node, associating the widget with it and rendering its contents.

Parameters

props

WidgetProps<P>

The widget props, including the target element.

Returns

PropertyGrid<P>

Inherited from

Widget.constructor

Properties

domNode

readonly domNode: HTMLElement

Defined in: src/ui/widgets/widget.ts:24

The DOM node this widget is bound to.

Inherited from

Widget.domNode


idPrefix

readonly idPrefix: string

Defined in: src/ui/widgets/widget.ts:22

The id prefix used for this widget's child element ids.

Inherited from

Widget.idPrefix


options

protected readonly options: WidgetProps<P>

Defined in: src/ui/widgets/widget.ts:18

The widget's options/props.

Inherited from

Widget.options


uniqueName

readonly uniqueName: string

Defined in: src/ui/widgets/widget.ts:20

A unique name for this widget instance, used for event namespacing.

Inherited from

Widget.uniqueName


[typeInfo]

static [typeInfo]: ClassTypeInfo<"Serenity.">

Defined in: src/ui/widgets/propertygrid.tsx:411

Overrides

Widget.[typeInfo]


isComponent

readonly static isComponent: true = true

Defined in: src/ui/widgets/widget.ts:334

Inherited from

Widget.isComponent

Accessors

element

Get Signature

get element(): Fluent

Defined in: src/ui/widgets/widget.ts:82

Returns a Fluent(this.domNode) object

Returns

Fluent

Inherited from

Widget.element


props

Get Signature

get props(): WidgetProps<P>

Defined in: src/ui/widgets/widget.ts:307

Returns the widget's props/options.

Returns

WidgetProps<P>

Inherited from

Widget.props


value

Get Signature

get value(): any

Defined in: src/ui/widgets/propertygrid.tsx:620

Gets the current values of all editors as an object.

Returns

any

Set Signature

set value(val): void

Defined in: src/ui/widgets/propertygrid.tsx:628

Loads values from an object into all editors.

Parameters
val

any

The object containing values to load.

Returns

void

Methods

addCssClass()

protected addCssClass(): void

Defined in: src/ui/widgets/widget.ts:89

Adds the widget's CSS class to its DOM node.

Returns

void

Inherited from

Widget.addCssClass


addValidationRule()

Call Signature

addValidationRule(rule, uniqueName?): void

Defined in: src/ui/widgets/widget.ts:142

Adds a validation rule to the widget's DOM node.

Parameters
rule

(input) => string

The validation rule function, or a unique name when the two-argument overload is used.

uniqueName?

string

A unique name for the rule, or the rule function when the two-argument overload is used.

Returns

void

Inherited from

Widget.addValidationRule

Call Signature

addValidationRule(uniqueName, rule): void

Defined in: src/ui/widgets/widget.ts:143

Adds a validation rule to the widget's DOM node.

Parameters
uniqueName

string

A unique name for the rule, or the rule function when the two-argument overload is used.

rule

(input) => string

The validation rule function, or a unique name when the two-argument overload is used.

Returns

void

Inherited from

Widget.addValidationRule


afterRender()

protected afterRender(callback): void

Defined in: src/ui/widgets/widget.ts:228

Queues a callback to run after the widget's contents are rendered.

Parameters

callback

() => void

The callback to run after rendering.

Returns

void

Inherited from

Widget.afterRender


byId()

protected byId<TElement>(id): Fluent<TElement>

Defined in: src/ui/widgets/widget.ts:154

Finds a child element by its prefix-relative id.

Type Parameters

TElement

TElement extends HTMLElement = HTMLElement

Parameters

id

string

The id relative to the widget's id prefix.

Returns

Fluent<TElement>

A Fluent wrapper for the matching element.

Inherited from

Widget.byId


canModifyItem()

protected canModifyItem(item): boolean

Defined in: src/ui/widgets/propertygrid.tsx:672

Determines whether a property item may be modified in the current mode.

Parameters

item

PropertyItem

The property item to check.

Returns

boolean

True if the item can be modified.


change()

change(handler): void

Defined in: src/ui/widgets/widget.ts:179

Registers a change handler on the widget's DOM node.

Parameters

handler

(e) => void

The change event handler.

Returns

void

Inherited from

Widget.change


changeSelect2()

changeSelect2(handler): void

Defined in: src/ui/widgets/widget.ts:188

Registers a change handler that ignores changes originating from combobox setting values.

Parameters

handler

(e) => void

The change event handler.

Returns

void

Inherited from

Widget.changeSelect2


commitEdits()

commitEdits(): Promise<boolean>

Defined in: src/ui/widgets/propertygrid.tsx:605

Commits pending edits on all editors that support it.

Returns

Promise<boolean>

True if all commits succeeded, false if any editor rejected.


deferRender()

protected deferRender(): boolean

Defined in: src/ui/widgets/widget.ts:98

Determines whether rendering should be deferred until init is called.

Returns

boolean

True to defer rendering.

Inherited from

Widget.deferRender


destroy()

destroy(): void

Defined in: src/ui/widgets/propertygrid.tsx:452

Destroys all field editors and clears the grid contents.

Returns

void

Overrides

Widget.destroy


enumerateItems()

enumerateItems(callback): void

Defined in: src/ui/widgets/propertygrid.tsx:500

Invokes a callback for each rendered field with its property item and editor widget.

Parameters

callback

(p1, p2) => void

Callback receiving the property item and editor widget.

Returns

void


findById()

protected findById<TElement>(id): TElement

Defined in: src/ui/widgets/widget.ts:163

Finds a child element by its prefix-relative id.

Type Parameters

TElement

TElement extends HTMLElement = HTMLElement

Parameters

id

string

The id relative to the widget's id prefix.

Returns

TElement

The matching element, or null if not found.

Inherited from

Widget.findById


get_editors()

get_editors(): Widget<any>[]

Defined in: src/ui/widgets/propertygrid.tsx:475

Returns the editor widgets for all rendered fields.

Returns

Widget<any>[]

Array of editor widgets.


get_idPrefix()

get_idPrefix(): string

Defined in: src/ui/widgets/propertygrid.tsx:491

Returns the id prefix used by this grid.

Returns

string

The id prefix.


get_items()

get_items(): PropertyItem[]

Defined in: src/ui/widgets/propertygrid.tsx:483

Returns the property items for all rendered fields.

Returns

PropertyItem[]

Array of property items.


get_mode()

get_mode(): PropertyGridMode

Defined in: src/ui/widgets/propertygrid.tsx:514

Returns the current grid mode (insert or update).

Returns

PropertyGridMode

The current PropertyGridMode.


getCssClass()

protected getCssClass(): string

Defined in: src/ui/widgets/widget.ts:106

Returns the CSS class(es) applied to the widget's DOM node.

Returns

string

The space-separated CSS class string.

Inherited from

Widget.getCssClass


getCustomAttribute()

protected getCustomAttribute<TAttr>(attrType, inherit): TAttr

Defined in: src/ui/widgets/widget.ts:220

Returns a custom attribute applied to the widget's type.

Type Parameters

TAttr

TAttr extends CustomAttribute

Parameters

attrType

(...args) => TAttr

The attribute type to look up.

inherit

boolean = true

Whether to search inherited types; defaults to true.

Returns

TAttr

The matching attribute, or null.

Inherited from

Widget.getCustomAttribute


getGridField()

getGridField(): Fluent

Defined in: src/ui/widgets/widget.ts:171

Returns the closest .field element containing the widget's DOM node.

Returns

Fluent

A Fluent wrapper for the grid field.

Inherited from

Widget.getGridField


init()

init(): this

Defined in: src/ui/widgets/widget.ts:243

Initializes the widget, rendering its contents if rendering was deferred.

Returns

this

This widget instance.

Inherited from

Widget.init


internalRenderContents()

internalRenderContents(): void

Defined in: src/ui/widgets/widget.ts:266

Renders the widget's contents and runs any queued after-render callbacks.

Returns

void

Inherited from

Widget.internalRenderContents


legacyTemplateRender()

protected legacyTemplateRender(): boolean

Defined in: src/ui/widgets/widget.ts:291

Renders the widget from a legacy getTemplate string, if defined.

Returns

boolean

True if a legacy template was rendered.

Inherited from

Widget.legacyTemplateRender


load()

load(source): void

Defined in: src/ui/widgets/propertygrid.tsx:561

Loads values from a source object into all field editors.

Parameters

source

any

The source object to read values from.

Returns

void


render()

render(): any

Defined in: src/ui/widgets/widget.ts:253

Returns the main element for this widget or the document fragment. As widgets may get their elements from props unlike regular JSX widgets, this method should not be overridden. Override renderContents() instead.

Returns

any

Inherited from

Widget.render


renderContents()

protected renderContents(): any

Defined in: src/ui/widgets/propertygrid.tsx:420

Renders the property grid contents, building categories/tabs and loading the initial value.

Returns

any

The rendered contents.

Overrides

Widget.renderContents


save()

save(target?): any

Defined in: src/ui/widgets/propertygrid.tsx:592

Saves all field editor values into a target object.

Parameters

target?

any

Optional target object; a new object is created if omitted.

Returns

any

The object containing the saved values.


set_mode()

set_mode(value): void

Defined in: src/ui/widgets/propertygrid.tsx:522

Sets the grid mode and refreshes the interface.

Parameters

value

PropertyGridMode

The new PropertyGridMode.

Returns

void


syncOrAsyncThen()

protected syncOrAsyncThen<T>(syncMethod, asyncMethod, then): void

Defined in: src/ui/widgets/widget.ts:318

Runs a method synchronously or asynchronously depending on the widget's useAsync flag, then invokes a continuation.

Type Parameters

T

T

Parameters

syncMethod

() => T

The synchronous method to run.

asyncMethod

() => PromiseLike<T>

The asynchronous method to run.

then

(v) => void

The continuation invoked with the result.

Returns

void

Inherited from

Widget.syncOrAsyncThen


updateFieldElement()

protected updateFieldElement(fieldElement): void

Defined in: src/ui/widgets/propertygrid.tsx:720

Updates a single field element in the current mode.

Parameters

fieldElement

PropertyFieldElement

The field element to update.

Returns

void


updateInterface()

updateInterface(): void

Defined in: src/ui/widgets/propertygrid.tsx:727

Refreshes the read-only/required state and visibility of all fields.

Returns

void


useIdPrefix()

protected useIdPrefix(): IdPrefixType

Defined in: src/ui/widgets/widget.ts:329

Returns an id prefix helper for resolving child element ids.

Returns

IdPrefixType

An IdPrefixType proxy for this widget's id prefix.

Inherited from

Widget.useIdPrefix


canModifyItem()

static canModifyItem(item, mode?): boolean

Defined in: src/ui/widgets/propertygrid.tsx:641

Determines whether a property item may be modified in the given mode, taking insert/update permissions into account.

Parameters

item

PropertyItem

The property item to check.

mode?

PropertyGridMode

The grid mode; defaults to update semantics when omitted.

Returns

boolean

True if the item can be modified.


create()

static create<TWidget, P>(params): TWidget

Defined in: src/ui/widgets/widget.ts:202

Creates a widget instance from the given params, appending its element to the container and invoking the init/init callbacks.

Type Parameters

TWidget

TWidget extends Widget<P>

P

P

Parameters

params

CreateWidgetParams<TWidget, P>

The widget creation params.

Returns

TWidget

The created widget instance.

Inherited from

Widget.create


createDefaultElement()

static createDefaultElement(): HTMLElement

Defined in: src/ui/widgets/widget.ts:75

Creates the default DOM element for a widget.

Returns

HTMLElement

A new div element.

Inherited from

Widget.createDefaultElement


getWidgetName()

static getWidgetName(type): string

Defined in: src/ui/widgets/widget.ts:131

Returns the widget name for a type, used for association and unique names.

Parameters

type

Function

The widget type.

Returns

string

The widget name.

Inherited from

Widget.getWidgetName


loadFieldValue()

static loadFieldValue(source, fieldElement, mode?): void

Defined in: src/ui/widgets/propertygrid.tsx:536

Loads a field's value from a source object into its editor, applying defaults in insert mode.

Parameters

source

any

The source object to read values from.

fieldElement

PropertyFieldElement

The field element whose editor receives the value.

mode?

PropertyGridMode

The grid mode, used to apply insert defaults.

Returns

void


registerClass()

protected static registerClass<TypeName>(typeName, intfAndAttr?): ClassTypeInfo<TypeName>

Defined in: src/ui/widgets/widget.ts:342

Registers this type as a class with the given type name.

Type Parameters

TypeName

TypeName

Parameters

typeName

StringLiteral<TypeName>

The type name to register.

intfAndAttr?

(InterfaceType | AttributeSpecifier)[]

Optional interfaces and attributes.

Returns

ClassTypeInfo<TypeName>

The class type info.

Inherited from

Widget.registerClass


registerEditor()

protected static registerEditor<TypeName>(typeName, intfAndAttr?): EditorTypeInfo<TypeName>

Defined in: src/ui/widgets/widget.ts:357

Registers this type as an editor with the given type name.

Type Parameters

TypeName

TypeName

Parameters

typeName

StringLiteral<TypeName>

The type name to register.

intfAndAttr?

(InterfaceType | AttributeSpecifier)[]

Optional interfaces and attributes.

Returns

EditorTypeInfo<TypeName>

The editor type info.

Inherited from

Widget.registerEditor


saveFieldValue()

static saveFieldValue(target, fieldElement, canModify?): void

Defined in: src/ui/widgets/propertygrid.tsx:576

Saves a field's editor value into a target object when the item is modifiable.

Parameters

target

any

The target object to write values into.

fieldElement

PropertyFieldElement

The field element whose editor value is saved.

canModify?

boolean

Whether the item may be modified; defaults to the result of PropertyGrid.canModifyItem.

Returns

void


updateFieldElement()

static updateFieldElement(fieldElement, mode?, canModify?): void

Defined in: src/ui/widgets/propertygrid.tsx:683

Updates a field element's editor read-only/required state and visibility based on the item and mode.

Parameters

fieldElement

PropertyFieldElement

The field element to update.

mode?

PropertyGridMode

The grid mode.

canModify?

boolean

Whether the item may be modified.

Returns

void