The following methods apply to all elements including the root awe.Page element.

In addition to the arguments documented below, every new_XXX method accepts these optional arguments:

  • id Override the generated element id. Useful with the @inject decorator.
  • props Pass additional props to the underlying react component.
  • style Override default element style with a javascript style object.
  • updater Accepts a callable, generator, async def and async generator. If passed, will be invoked asynchronously with the created element as its single argument. It may be long running. A convenient way of updating elements in the background.
class awe.view.Element[source]
new_grid(columns, **kwargs)[source]

Add a grid child.

Grid children created with new_XXX methods can provide an additional cols argument which defaults to 1. Element flow is left, right, top, down.

Parameters:columns – Number of columns for the grid.
Returns:The created grid element.

Add a tabs child.

The only valid new_XXX method on tabs is new_tab.

Returns:The created tabs element.
new_table(headers, page_size=None, **kwargs)[source]

Add a table child.

  • headers – list of string headers or dict, in which case, it’s keys are used.
  • page_size – Optionally, enable table pagination by specifying a page size.

The created table element.

new_button(function, text='', icon=None, shape=None, type='default', block=False, **kwargs)[source]

Add a button child.

Most properties here are passed as is to the underlying ant-design button component, so refer to its documentation for more information.

  • function – The python function that should be invoked then the button is clicked.
  • text – Option text for the button, the function name is used by default (unless shape is supplied).
  • icon – See ant design icon documentation.
  • type – Any of: default (which is the default), primary, ghost, dashed, danger.
  • shape – Optionally pass circle for a circle shaped button.
  • block – Pass True to make the button fit the full width of its parent element.

The created button element.

new_input(placeholder=None, on_enter=None, **kwargs)[source]

Add an input child.

  • placeholder – Optional placeholder text for the input.
  • on_enter – Option function to be called when enter is pressed in the input.

The created input element.

new_card(text='', **kwargs)[source]

Add a card child.

A card is a small padded box.

Parameters:text – Optional text for the card. Otherwise, use new_XXX methods as usual.
Returns:The created card element.
new_text(text='', **kwargs)[source]

Add a text child.

Parameters:text – Optional text, otherwise, interpreted as line break. \n will be interpreted correctly.
Returns:The created text element.

Add a divider child.

A divider is a simple horizontal separator.

Returns:The created divider element.

Add a collapse child.

The only valid new_XXX method on collapse is new_panel.

Returns:The created collapse element.
new_chart(data=None, options=None, transform=None, moving_window=None, **kwargs)[source]

Add a chart child.

  • data – A list of data items. Each data item is expected to match the format the transformer expects. A data item may also be supplied in the form of a 2-tuple (time, data), in which case, the first item is the epoch time in seconds with ms precision and the second item is the data item itself.
  • options – Optional highcharts options object.
  • transform – A transformer for the supplied data which transforms the data into suitable highcharts charts and series definitions. Can be either a transformer object, a dict with transformer configuration or a string specifying the transformer name.
  • moving_window – Optional moving window size in seconds. If specified, chart will maintain this window size.

The created chart element.

new_icon(type, theme='outlined', spin=False, two_tone_color=None, **kwargs)[source]

Add a new icon element.

Most properties here are passed as is to the underlying ant-design icon component, so refer to its documentation for more information.

  • type – The icon type. See ant design icon documentation.
  • theme – Any of: outlined (the default), filled, twoTone
  • spin – Pass True to make the icon spin.
  • two_tone_color – When theme is twoTone, a CSS style color for the main color of the icon.

The created icon element.

new_inline(text='', **kwargs)[source]

Add a new inline element.

Useful in combination with icons. As opposed to new_text, new_inline doesn’t take up a full line when added (a span is used internally).

Parameters:text – Optional text for the inline. Inline can also be a container element.
Returns:The created inline element.

Add a new link element.

Parameters:link – The link (URL)
Returns:The created link element.
new_markdown(source, **kwargs)[source]

Add a new markdown element.

Parameters:source – The markdown source.
Returns:The created markdown element.
new_prop(prop, root=None)[source]

Create a new element based prop.

Mostly used by element implementations but can be used for some low level updates.

Normally, the regular props field is used to pass basic data structures to the underlying react components. Sometimes however, the underlying react component prop accepts a ReactNode as the prop value. In these cases, using new_prop will create a new “root” element, similar to Page. Use the standard new_XXX methods on it to create the element hierarchy that will be passed to the underlying react component prop.

Note that a prop named PROP_NAME can only be created if it doesn’t already exist in props and was not created with a previous new_prop call.

  • prop – The prop name.
  • root – Optionally, use a root element built using the element builder

The created element based prop.

new(obj, **kwargs)[source]

This method can return different results depending on obj type.

If obj is a class that inherits from Element, a new element of that type will be created. If obj is a dict or list, it will be parsed and the parser result will be created. If obj is a string, it will be yaml loaded and that result will be passed to the parser.

When result is passed to the parser, an additional inputs argument can be supplied as a dict from keys to values that are referenced in the DSL using the $ intrinsic function.

  • obj – The Element subclass, a dict/list or a string to be passed to the parser.
  • kwargs – Arguments that should be passed to the _init method of the created element or one of props, style, id, inputs if valid.

The created element.


Register a new custom element.

Not that there is not need to explicitly call this method. When creating a new custom element, the element will be registered for you if it isn’t already registered.

Parameters:custom_element_cls – A subclass of CustomElement.

Remove an element from the page.

Parameters:element – If supplied, remove the supplied element, otherwise, remove self.

Update element data.

Mostly used by element implementations but can be used for some low level updates.

Parameters:data – The data to update.
update_props(props, override=True)[source]

Update element props (underlying react component props).

Mostly used by element implementations but can be used for some low level updates.

  • props – The props to update.
  • override – Should the supplied props override existing props. (default: True)
update_prop(path, value)[source]

Update a prop inner value.

Mostly used by element implementations but can be used for some low level updates.

  • path – The nested path of the prop. If the prop is named A then reaching A.b.c would be ['A', 'b', 'c'].
  • value – The value to set in the nested prop path.
update_element(path, action, data)[source]

Very low level method that dispatches an updateElement action to the react application running the page. Usually preceded by an internal element data update.


Push current element to stack and return self.


Pop an element from the stack.

Returns:The popped element.

Return the top most stack element.

Returns:The last stacked element or the current root element if none was stacked.