Content Panel

Feature177 Content#feature177
Heading

No tutorials needed.

Description

If you can order food online, you can build a website with Beste.

About this piece

Content Panel

Side-panel content editor with a header chip row, locale and history pills, and stacked rich-text fields for heading and description.

Usage

The import and the props worth knowing about, in one place.

import { Editor46 } from "@/components/beste/piece/editor46";

<Editor46
  surface="card"
  bordered={true}
  inverted={false}
  componentId="Feature177 Content"
  componentTag="#feature177"
  locale="🇺🇸"
  sizeLabel="Size"
  headingLabel="Heading"
  heading="No tutorials needed."
  descriptionLabel="Description"
  description="If you can order food online, you can build a website with Beste."
/>

More Editor pieces

View all Editor
Outline
  • Dashboard
  • constructor
  • state
  • render
  • computeStats

Outline Panel

Document outline with colored kind tiles for class, function, method, and prop. Depth-indented with an active row.

col guide80
const message = `Hello`;
const longer = `Shipping the biggest onboarding upgrade yet`;
const wrapped = items.map((i) => i.name).join(', ') + '!'

Ruler Guide

Editor panel with a rose vertical column-limit ruler and numbered code lines behind it.

Appearance

Images

Image entrance
Scroll effect

Motion

Section animation
Animation speed

Appearance Motion Panel

Site-wide appearance settings grouped the way a builder sidebar groups them, each value arriving from the right as its row lands.

Your page looks empty

Start by adding your first block.

Empty Page

Centered editor placeholder with a soft icon tile, headline, hint line, and a recolorable call-to-action pill.

Feature#feature283
Padding96 px
Container7xl
BackgroundBackground
Card bordersPer block

Section Settings Sidebar

Everything that shapes a section but is kept off the page itself, with a soft highlight travelling down the rows to show each one is a live control.

Call stack
  • renderListlist.tsx:42
  • Dashboarddashboard.tsx:14
  • Appapp.tsx:8

Debugger Panel

Call stack list with function names, source file and line, and an amber current-frame highlight.