UIGridContainerElementCreate

---

The parameters for creating a grid container element.

See UIGridContainerElement for more details.

Properties

type

type: "Grid"

---

items

items: (UIButtonElementCreate | UITextElementCreate | UIDividerElementCreate | UITextInputElementCreate | UISelectElementCreate | UIFlexibleSpaceElementCreate | UIButtonRowElementCreate | UICheckboxGroupElementCreate | UIRadioGroupElementCreate | UIToggleGroupElementCreate | UIIframeElementCreate)[]

The items to add to the grid container.

---

grid?

optional grid: string

The grid to use for the container. It is the exact same as CSS's shorthand property grid.

Example

horizontal stack

two columns, the first column is 50px wide, the second column takes the remaining space

{
  type: "Grid",
  grid: "auto-flow / 50px 1fr",
  items: [...]
}

See

https://developer.mozilla.org/en-US/docs/Web/CSS/grid for more details.

---

verticalAlignment?

optional verticalAlignment: "center" | "top" | "bottom"

The alignment of the items in the grid. Only takes effect on horizontal stacks.

Default Value

"top"

---

horizontalDistribution?

optional horizontalDistribution: "center" | "start" | "end" | "space-between" | "space-around" | "space-evenly"

The distribution of the items in the grid. Only takes effect on horizontal stacks.

Default Value

"start"

---

onCreate()?

optional onCreate: (args: { id: string; }) => void

A function to call when the element is created.

Parameters

Parameter	Type	Description
args	{ id: string; }	The arguments passed to the function.
args.id	string	The id of the element.

Returns

void

---

onDestroy()?

optional onDestroy: (args: { id: string; }) => void

A function to call when the element is destroyed.

Parameters

Parameter	Type	Description
args	{ id: string; }	The arguments passed to the function.
args.id	string	The id of the element.

Returns

void

---

id?

optional id: string

The ID of the element.

Remarks

If not provided, the element will be assigned a random ID, but it is recommended to provide it to perform further updates on the element.

If provided, it must be unique within the UI.

Default Value

undefined