Effects & Inputs
Effects
App components can be configured with multiple effects in different interactions.
Supported interactions include:
Click
Execute list effects if the component is clicked.
Scroll
Execute list of effects while the component is scrolling.
Scroll End
Execute list of effects when the component scroll reaches the bottom.
Value Change
Execute list of effects when a component's value changes. In the case of text containers - if the text content changes.
Hover
Execute list of effects if the component is hovered on.
Create
Execute list of effects when the component is created.
Destroy
Execute list of effects when the component is destroyed.
Supported effects include:
Show Component
Show the component.
Hide Component
Hide the component.
Show Loader
Show the built-in spinner.
Destroy Component
Destroy the component.
Change Value
Change the value of the component. In the case of text containers, change the content of the container.
Change Attribute
Change the value of an attribute of the component. Properties of an attribute can be accessed with dot notations i.e. style.borderLeft.
Open Link
Open a link in a new tab in the device's web browser.
Go to Link
Go to a link in the app -> change the app's page to the target link - this can be a link to an app's page.
Boardcast Data
Broadcast data to the parent window (if the app is not standalone and contained in an iframe).
Show Message
Show a message in the built-in popup box.
Create Variable
Create a variable with value in the app - this variable is not accessible from the app's logic.
Merge Variables
Merge values of 2 variables.
Render Component
Render an app's page as a component into the current page - replace the values in the new component with the given value. If the value is an array, the component will be rendered multiple times - for each item in the array. This effect is useful for iterating multiple items in a list.
Show Prompt
Show a prompt with the built-in prompt popup box.
Send Message
Perform an HTTP call with payload to a target i.e. an API - supported methods include: GET, POST, DELETE, & PUT.
Inputs
Inputs are exclusive to Farcaster Frames. These are buttons, text input, and state that allow the user to interact with Farcaster Frames. Inputs are optional, a frame can have multiple or no inputs.
A Farcaster Frame state is also an input and can be configured with a value.
Supported Farcaster Frame Inputs:
Button 1
The first button for the frame.
Button 2
The second button for the frame.
Button 3
The third button for the frame.
Button 4
The fourth button for the frame.
Text Input
The text input for the frame.
State
The state of the frame.
JSON String
Farcaster Frame inputs can configured to perform different purposes including: to perform a transaction, to open a link, to create a redirect request, to mint and nft, or post data to the app.
Questions?
Let us know on contact@frames.sh.
Last updated
