Reorder a section to a new 0-based index within the page's existing sections. Sections are stacked vertically in array order. Call get_page first to learn the page's current structure and the IDs to target.
AuthorizationRequiredBearer <token>API key as Bearer token
In: header
application/jsonRequiredtoIndexRequiredintegerThe section's desired final index. Must be in [0, sections.length - 1]: the array size is unchanged, unlike add-section which can target length.
0Maximum: 9007199254740991pageIdRequiredstringsectionIdRequiredstringcurl -X PUT "https://api.3common.com/v1/pages/string/sections/string/position" \
-H "Authorization: Bearer <token>" \
-H "Content-Type: application/json" \
-d '{
"toIndex": 9007199254740991
}'{
"data": {
"id": "string",
"hostId": "string",
"name": "string",
"medium": "email",
"sections": [
{
"id": "string",
"elements": [
{
"id": "string",
"padding": {
"top": 0,
"bottom": 0,
"left": 0,
"right": 0
},
"background": {
"type": "color",
"color": "string"
},
"layout": {
"property1": {
"row": 9007199254740991,
"col": 9007199254740991,
"rowSpan": 9007199254740991,
"colSpan": 9007199254740991
},
"property2": {
"row": 9007199254740991,
"col": 9007199254740991,
"rowSpan": 9007199254740991,
"colSpan": 9007199254740991
}
},
"type": "divider",
"orientation": "vertical",
"color": "string"
}
],
"rows": {
"property1": 9007199254740991,
"property2": 9007199254740991
},
"background": {
"type": "color",
"color": "string"
}
}
],
"background": {
"type": "color",
"color": "string"
},
"schemaVersion": 1,
"revisionCount": 0
}
}export interface Response {
data: {
id: string;
hostId: string;
/**
* The name of the content, for easy identification by the creator (not visible
* in the rendered output).
*/
name: string;
/**
* The medium this page belongs to. Determines what kind of elements its
* sections can contain, and which breakpoints are supported (which in turn
* determines page width and the number of columns in each section).
*/
medium: "email";
sections: {
id: string;
elements: (
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "divider";
orientation: "vertical" | "horizontal";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
}
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "text";
richText: {
type: "doc";
/**
* @minItems 1
*/
content: [
(
| {
type: "paragraph";
attrs?: {
textAlign: "left" | "center" | "right" | "justify";
};
content?: (
| {
type: "text";
text: string;
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "hardBreak";
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "smartValue";
attrs: {
key: string;
};
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
)[];
}
| {
type: "heading";
attrs: {
textAlign: "left" | "center" | "right" | "justify";
level: 1 | 2 | 3;
};
content?: (
| {
type: "text";
text: string;
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "hardBreak";
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "smartValue";
attrs: {
key: string;
};
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
)[];
}
| TextBulletList
| TextOrderedList
),
...(
| {
type: "paragraph";
attrs?: {
textAlign: "left" | "center" | "right" | "justify";
};
content?: (
| {
type: "text";
text: string;
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "hardBreak";
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "smartValue";
attrs: {
key: string;
};
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
)[];
}
| {
type: "heading";
attrs: {
textAlign: "left" | "center" | "right" | "justify";
level: 1 | 2 | 3;
};
content?: (
| {
type: "text";
text: string;
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "hardBreak";
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "smartValue";
attrs: {
key: string;
};
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
)[];
}
| TextBulletList
| TextOrderedList
)[]
];
};
/**
* Color applied to all of the element's text, except links.
*/
textColor: string;
/**
* Color applied to the element's link text.
*/
linkColor: string;
}
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "button";
/**
* The text shown on the button.
*/
label: string;
/**
* The button's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. An empty
* string or a token that gives no usable URL leaves the button with no link.
*/
href: string;
/**
* Color of the button surface itself, drawn inside the element's padding. Distinct from `background`, which fills the whole cell behind it.
*/
fillColor: string;
/**
* Color applied to the button's label.
*/
textColor: string;
/**
* Size of the button's text, in pixels.
*/
fontSize: number;
/**
* Corner rounding of the button, in pixels. Zero is a square button.
*/
borderRadius: number;
}
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "image";
/**
* The image to display, absent until one has been chosen. An image element can
* be placed and resized before it has any content.
*/
image?: {
/**
* ID of the registered image asset this element displays.
*/
assetId: string;
/**
* The asset's public download URL at the time it was chosen, denormalized so
* renderers need no asset lookup.
*/
src: string;
/**
* The asset's intrinsic pixel width, used to preserve its aspect ratio.
*/
width: number;
/**
* The asset's intrinsic pixel height, used to preserve its aspect ratio.
*/
height: number;
/**
* The asset's original filename, so the editor can name the chosen image.
*/
filename: string;
};
/**
* Alternative text describing the image, read by screen readers and shown by
* clients which block images. Can be left empty, but is recommended for
* accessibility.
*/
alt: string;
/**
* Where the image sits horizontally when it is narrower than the space
* available to it.
*/
horizontalAlign: "left" | "center" | "right";
/**
* Where the image sits vertically when it is shorter than the space available
* to it.
*/
verticalAlign: "top" | "middle" | "bottom";
/**
* Link which wraps the image. Leave empty for plain images.
*/
href: string;
}
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "socialLinks";
/**
* The buttons to show, ordered left to right. May be empty, in which case the
* element renders nothing. The same platform may appear more than once.
*
* @maxItems 12
*/
socialLinks:
| []
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
]
| [
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
},
{
/**
* Which platform's icon this entry shows.
*/
platform: "website" | "facebook" | "instagram" | "twitter" | "linkedin" | "email";
/**
* The entry's destination URL, or an empty string for no link. A {{smart value}} token is not resolved here, so it leaves the entry with no link.
*/
href: string;
}
];
/**
* Color of the button surfaces themselves, drawn inside the element's
* padding. Distinct from `background`, which fills the whole cell behind
* them.
*/
fillColor: string;
/**
* Where the row of buttons sits horizontally when it is narrower than the
* space available to it.
*/
horizontalAlign: "left" | "center" | "right";
/**
* Side length of each square button, in pixels.
*/
socialButtonSize: number;
/**
* Space between adjacent buttons, in pixels.
*/
socialGap: number;
/**
* Corner rounding of each button, in pixels. Zero is a square button, half of the button size is a circle.
*/
socialBorderRadius: number;
}
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "table";
/**
* The table's columns, left to right. They all share the table's row count;
* each column's `source` decides where its own body cells come from.
*
* @minItems 1
* @maxItems 6
*/
tableColumns:
| [
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
]
| [
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
)
]
| [
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
)
]
| [
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
)
]
| [
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
)
]
| [
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
),
(
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "literal";
/**
* The column's body cells, top to bottom, as plain text. This array does not
* have to match the table's rendered row count: entries past it are ignored,
* and rows past the end of it render empty.
*
* @maxItems 50
*/
cells: string[];
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "repeating";
/**
* One plain-text value, echoed in every rendered row. Useful for a constant
* beside a column bound to a smart value; a repeating column never affects the
* table's row count.
*/
value: string;
}
| {
/**
* The column's header text, shown when the element's `tableShowHeader` is
* true. Plain text: a smart value cannot be embedded in it.
*/
label: string;
/**
* Horizontal alignment of this column's header and body cells.
*/
align: "left" | "center" | "right";
source: "smartValue";
/**
* The bare key of an array smart value ('order.productNames', not
* '{{order.productNames}}'), resolved at render time to fill this column's
* body cells, one per row. The longest bound column decides how many rows the
* table renders, except that the element's `tableRowCount` stays a lower
* bound while any column's `source` is 'literal'; a shorter, missing, or
* empty bound column renders empty cells for the remaining rows.
*/
smartValueKey: string;
}
)
];
/**
* How many body rows to render when no column is bound to a smart value. When
* one is, the longest bound array sets the row count instead, except that this
* stays a lower bound for as long as any column's `source` is 'literal', so
* binding one column can't drop cells authored in another. This is the table's
* own row count, unrelated to the section's grid rows.
*/
tableRowCount: number;
/**
* Whether to render a header row of the columns' labels above the body rows.
*/
tableShowHeader: boolean;
/**
* Size of the text in every cell, header and body alike, in pixels.
*/
tableFontSize: number;
/**
* Color of the header cells' text. Only visible when `tableShowHeader` is true.
*/
tableHeaderTextColor: string;
/**
* Color of the body cells' text.
*/
tableBodyTextColor: string;
/**
* Fill behind the header cells. Only visible when `tableShowHeader` is true.
*/
tableHeaderFillColor: string;
/**
* Fill behind the body cells. Distinct from `background`, which fills the whole footprint behind the table.
*/
tableBodyFillColor: string;
/**
* Color of the grid lines drawn between and around the cells. Set it to match
* `tableBodyFillColor` for a table with no visible grid.
*/
tableBorderColor: string;
}
| {
id: string;
/**
* Padding in pixels, applied inside the element's cell box (does not affect
* column width).
*/
padding: {
top: number;
bottom: number;
left: number;
right: number;
};
/**
* Omitting an element's background results in a transparent background.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
/**
* A layout for each breakpoint supported by the current medium. Only one needs
* to be set upon inserting an element, the remaining layouts will be seeded
* based on reading order.
*/
layout: {
[k: string]: {
/**
* 0-based row index, where 0 is the section's top row.
*/
row: number;
/**
* 0-based column index, where 0 is the section's leftmost column.
*/
col: number;
rowSpan: number;
colSpan: number;
};
};
type: "qrCode";
/**
* What the code encodes, absent until the user sets it. A QR code element can
* be placed and resized before it has any payload.
*/
qrValue?:
| {
source: "literal";
/**
* The exact text to encode. It does not have to be a URL: a ticket ID that
* door staff scan is equally valid. Braces carry no meaning here, thus
* '{{order.id}}' encodes those 12 characters. Bind the element to a smart
* value instead to encode a per-recipient value.
*/
value: string;
}
| {
source: "smartValue";
/**
* The bare key of a scalar smart value ('order.id', not '{{order.id}}'),
* resolved at render time to give the payload. Each recipient thus gets a
* different code. A missing or empty value renders no code at all.
*/
smartValueKey: string;
};
/**
* Alternative text describing the code, read by screen readers and shown by
* clients which block images. Say what the code is for ('Your ticket'), since
* the payload itself is not useful to a person.
*/
alt: string;
/**
* Where the code sits horizontally when it is narrower than the space
* available to it.
*/
horizontalAlign: "left" | "center" | "right";
/**
* Where the code sits vertically when it is shorter than the space available
* to it.
*/
verticalAlign: "top" | "middle" | "bottom";
}
)[];
/**
* Sections have different numbers of rows for each breakpoint supported by the
* current medium, e.g. so sections can be taller in narrower breakpoints.
*/
rows: {
[k: string]: number;
};
/**
* Omitting a section's background results in a transparent background,
* revealing the page background behind it.
*/
background?: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
}[];
/**
* For media with a fixed width (email), this determines the background color
* outside of the letterboxed area. For other media which scales to fill the
* viewport, it will only be visible where it isn't obstructed by a section's
* background. Backgrounds are mandatory for pages.
*/
background: {
type: "color";
/**
* A 6-digit hexadecimal color with "#" prefix
*/
color: string;
};
schemaVersion: 1;
revisionCount: number;
};
}
export interface TextBulletList {
type: "bulletList";
/**
* @minItems 1
*/
content: [TextListItem, ...TextListItem[]];
}
export interface TextListItem {
type: "listItem";
/**
* @minItems 1
* @maxItems 1
*/
content: [
{
type: "paragraph";
attrs?: {
textAlign: "left" | "center" | "right" | "justify";
};
content?: (
| {
type: "text";
text: string;
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "hardBreak";
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "smartValue";
attrs: {
key: string;
};
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
)[];
}
];
}
export interface TextOrderedList {
type: "orderedList";
attrs?: {
start: number;
};
/**
* @minItems 1
*/
content: [TextListItem1, ...TextListItem1[]];
}
export interface TextListItem1 {
type: "listItem";
/**
* @minItems 1
* @maxItems 1
*/
content: [
{
type: "paragraph";
attrs?: {
textAlign: "left" | "center" | "right" | "justify";
};
content?: (
| {
type: "text";
text: string;
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "hardBreak";
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
| {
type: "smartValue";
attrs: {
key: string;
};
marks?: (
| {
type: "bold" | "italic" | "strike" | "underline";
}
| {
type: "link";
attrs: {
/**
* The link's destination: a URL, or one complete {{smart value}} token. The
* renderer replaces the token and validates the result as a URL. This field
* is never empty, because text with no destination is not a link.
*/
href: string;
};
}
| {
type: "textStyle";
attrs: {
fontSize: 8 | 9 | 10 | 11 | 12 | 14 | 18 | 24 | 30 | 36 | 48 | 60 | 72 | 96;
};
}
)[];
}
)[];
}
];
}
Delete Page Section
Delete a section and all of the elements in it. A page must always have at least one section, so deleting the last remaining section is rejected. Call get_page first to learn the page's current structure and the IDs to target.
List Emails
Lists the workspace's emails, optionally filtered by view (draft / past). Paginated; returns recipient-stripped summaries so list payloads stay small. Sorted by updatedAt descending.