ComponentsManaging Components

Get a prop (Beta)

component.getProp(propId)

Returns a single prop definition by its ID.

This method returns a prop definition: the schema for the prop including its type, name, group, and default value. Use this method when you already have a prop ID (for example, from a component.createProp() response) and need to look up its current definition without fetching all props. To retrieve all prop definitions on a component, use component.getProps().

Beta

These methods are in public beta and may change with future releases.

Syntax

component.getProp(propId: string): Promise<Prop>

Parameters

  • propId : string — The unique ID of the prop to retrieve.

Returns

Promise<Prop>

A Promise that resolves to the Prop object for the given ID.

The Prop interface uses the same shape as the return value of component.createProp():

interface Prop {
  /** Unique prop ID. */
  id: string;
  /** The prop type. */
  type: PropType;
  /** The binding value type, derived from the prop type. */
  valueType: BindableValueType;
  /** Value types that this prop can bind to. */
  bindableTo: readonly BindableValueType[];
  /** Display name. */
  name: string;
  /** Group name, or null if ungrouped. */
  group: string | null;
  /** Tooltip text, or null if not set. */
  tooltip: string | null;
  /** Default value, or null if not set. */
  defaultValue: unknown | null;
  // Type-specific settings, included when applicable:
  multiline?: boolean;   // textContent
  min?: number;          // number
  max?: number;          // number
  decimals?: number;     // number
  trueLabel?: string;    // boolean
  falseLabel?: string;   // boolean
}

Examples

Get a prop by its ID:

const component = await webflow.getCurrentComponent()
if (component) {
  const prop = await component.getProp('abc_id123')
  console.log(prop)
  /*
  {
    id: 'abc_id123',
    type: 'link',
    valueType: 'link',
    bindableTo: ['link'],
    name: 'CTA Link',
    group: 'Content',
    tooltip: null,
    defaultValue: {
      mode: 'url',
      to: 'https://example.com/signup',
      openInNewTab: true
    }
  }
  */
}

Create a prop and then look it up by its ID:

const component = await webflow.getCurrentComponent()
if (component) {
  const created = await component.createProp({
    type: 'number',
    name: 'Max Items',
    min: 1,
    max: 100,
    defaultValue: 10,
  })
  // Later, fetch the current definition by ID
  const prop = await component.getProp(created.id)
  console.log(prop.name) // 'Max Items'
}

Designer Ability

Checks for authorization only.

Designer AbilityLocaleBranchWorkflowSitemode
canAccessCanvasAnyAnyAnyAny