For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
Sign in
DocsAPI ReferenceChangelog
DocsAPI ReferenceChangelog
  • Get started
    • Quickstart
    • Concepts
  • Guides
    • Environments
  • Reference
        • Checkbox
        • Code
        • Color
        • Combobox
        • Group
        • Image
        • Font
        • Link
        • List
        • Number
        • Rich Text
        • Select
        • Slot
        • Style
        • Text Area
        • Text Input
      • Makeswift API Handler
    • Product docs
    • Blog
    • Support
Sign in
LogoLogo
On this page
  • Params
  • Prop type
  • Example
Reference@makeswift/runtimeControls

TextArea

Was this page helpful?
Previous

Style

Next

TextInput

Built with

Adds a multiline Text Area to your component in the Makeswift builder to visually edit a string prop.

A Text Area panel for a Code Block component to change the code

Params

label
stringDefaults to Text

Text for the panel label in the Makeswift builder.

description
string

The description shown in the Panel of the Makeswift builder. This can be written in Markdown format. Added in v0.24.8.

defaultValue
string

The value passed to your component when nothing is set in the Makeswift builder.

Prop type

The TextArea control passes a string to your component. If you don’t set a defaultValue and no value is set in the builder, your component receives undefined.

Example

The following example adds a Text Area control to the Code prop of a Code Block component.

1import { TextArea } from "@makeswift/runtime/controls";
2
3import { runtime } from "../../../../../makeswift/runtime";
4
5import { CodeBlock } from "./CodeBlock";
6
7runtime.registerComponent(CodeBlock, {
8 type: "code-block",
9 label: "Code Block",
10 props: {
11 code: TextArea({ label: "Code" }),
12 },
13});

.makeswift.ts is a naming convention for organizing Makeswift registration code. Learn more.