Skip to content

Props

Props define the configurable inputs of a component. Each prop has a type, a default value, and optional extensions.

type Props = Record<string, AnyProp>;
type AnyProp = BooleanProp | StringProp | EnumProp | NumberProp | SlotProp | ImageProp;

Prop Kinds

BooleanProp

PropertyTypeRequiredDescription
type'boolean'Yes
defaultbooleanYesDefault value
$extensionsPropExtensionsNoVendor extensions

EnumProp

PropertyTypeRequiredDescription
type'string'Yes
defaultstringYesDefault value (must be in enum)
enumstring[]YesAllowed values
nullablebooleanNoWhether null is a valid value — absent means false
$extensionsPropExtensionsNoVendor extensions

StringProp

PropertyTypeRequiredDescription
type'string'Yes
defaultstring | nullNoDeprecated — use examples
nullablebooleanNoWhether null is a valid value — absent means true
examplesstring[]NoExample values
$extensionsPropExtensionsNoVendor extensions

A StringProp is distinguished from an EnumProp by the absence of enum.

NumberProp

PropertyTypeRequiredDescription
type'number'Yes
defaultnumberNoDefault value
enumnumber[]NoClosed set of allowed values, recorded when the prop was inferred from a VARIANT prop’s finite value set (ADR-072)
nullablebooleanNoWhether null is a valid value — absent means true (since 0.29.0)
examplesnumber[]NoExample values

Inferred from Figma variant values when conventions.platforms.figma.inferNumberProps is enabled; a prop inferred from a VARIANT source carries the variant’s values as enum.

SlotProp

PropertyTypeRequiredDescription
type'slot'Yes
defaultstring | nullNoDefault slot content
nullablebooleanNoWhether null is a valid value — absent means true
minChildrennumberNoMinimum number of children the slot accepts (since 0.25.0)
maxChildrennumberNoMaximum number of children the slot accepts (since 0.25.0)
anyOfstring[]NoPermitted component type names (since 0.14.0)
$extensionsPropExtensionsNoVendor extensions

Slot constraint properties (minChildren, maxChildren, anyOf) are emitted when conventions.platforms.figma.slotConstraints is declared.

ImageProp

PropertyTypeRequiredDescription
type'image'Yes
defaultstring | nullNoDefault image — an images registry reference, or null
nullablebooleanNoWhether null is a valid value — absent means true
examplesImageValue[]NoAuthoring-default images the component was authored with (since 0.33.0)
$extensionsPropExtensionsNoVendor extensions

An image-valued property (e.g. a dsImage source prop). Emitted for code-only props named in figma.images.sourceProps (since 0.28.0).

An authoring-default image sits in one of two places, and they describe different things:

LocationDescribes
ImageBinding.examplesThe image at that binding site — how one consumer placed it
ImageProp.examplesThe image the component itself was authored with

Where both apply to one rendered instance, the binding is the more specific statement. A designated image component is the origin of an image rather than a consumer of one, so it has no binding site in its own spec — examples on the prop is its only home for this.

examples is non-contractual reference material, parallel to StringProp.examples, and is distinct from default: a default states what the prop resolves to when a consumer omits it, while examples only demonstrate typical content.

props:
imageSource:
type: image
examples:
- $image: "#/components/dsImage/images/dsImage__image"

Nullability

nullable is optional on every prop kind that carries it. Its absence is meaningful, and what it means depends on whether the prop’s value set is open or closed:

Prop kindAbsent nullable meansWhy
StringProptrueOpen value set — nothing enumerates it
NumberProptrueOpen value set
SlotProptrueOpen content set; a slot may be empty
ImageProptrueOpen value set
EnumPropfalseenum lists every accepted value, and null is not one of them
BooleanProp(no field)Booleans are never nullable

An explicit nullable: false on an open-valued prop asserts that a value always exists — useful when a code-only prop was authored with a non-empty default:

props:
# No nullable key — accepts null
label:
type: string
# Explicitly asserts a value is always present
headingLevel:
type: number
default: 2
nullable: false

Extensions

The $extensions object holds vendor-specific metadata. Currently only the com.figma extension is defined.

FigmaPropExtension

PropertyTypeDescription
typestringFigma property type (e.g. BOOLEAN, TEXT, INSTANCE_SWAP, VARIANT)
sourceFigmaCodeOnlySourcePresent when the prop originates from a code-only prop layer
namestringThe Figma property name, present only when the prop key cannot reconstruct it — see Key Formatting

FigmaCodeOnlySource

PropertyTypeDescription
kind'codeOnlyProp'Always 'codeOnlyProp'
layerstringSub-layer name in the code-only container
instanceOfstringComponent name, for enum code-only props

Further Reading