FooterAction

A button in an environment's footer, such as "Add point", with an optional picture or icon before its label.

@internote/canvas-sdk/reactComponent
On this page
import { FooterAction } from '@internote/canvas-sdk/react';

lead takes a picture of what the button makes, the thing itself where there is one, and icon falls back to a glyph from the footer's own set. A row of these reads as a row of things rather than a row of plus signs with words after them.

#Props

Takes no className, style or id.

accent
What the picture on it is drawn in.
string
ariaLabel
The accessible name, where the caption alone does not say what the button does.
string
children
The button's caption.
ReactNode
disabled
Whether the button is shown but cannot be pressed.
boolean
hoverTint
The ground under the cursor — a step up from tint.
string
icon
An icon from the SDK's own set, drawn when there is no lead.
playpauseplusremovesettingslockeyeeyeOffchevronDownchevronUpchevronLeftchevronRightcheckcrossdashzoomInzoomOutzoomResetreset
lead
A picture of what the button makes, drawn in accent in place of the icon.
ReactNode
onClickRequired
Called when the button is pressed.
() => void
textColour
What its label is set in, against that ground.
string
tint
The button's ground — the palest tone of whatever it makes.
string

#Example

<FooterAction icon="plus" onClick={addPoint} tint={hueTint('blue')} accent={colourCss('blue')}>Add point</FooterAction>

Declared in packages/canvas-sdk/src/react/footer-actions.tsx:34.

Last updated