TextArea

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

Params

string

default:"Text"

Text for the panel label in the Makeswift builder.

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.

import { TextArea } from "@makeswift/runtime/controls"

import { runtime } from "@/makeswift/runtime"

import { CodeBlock } from "./CodeBlock"

runtime.registerComponent(CodeBlock, {
  type: "code-block",
  label: "Code Block",
  props: {
    code: TextArea({ label: "Code" }),
  },
})

import { highlight, languages } from "prismjs"

interface Props {
  code?: string
}

export function CodeBlock({ code }) {
  return (
    <pre
      dangerouslySetInnerHTML={{
        __html: highlight(code, languages.js, "js"),
      }}
    />
  )
}

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

Get started

Guides

Reference

Integrations

Params

Prop type

Example

​Params

​Prop type

​Example

Params

Prop type

Example