Skip to main content

longText

clamped multi-line text.

The longText cell rendered in a Bst-Table grid

Example source
import React from 'react'
import { BstTableMui } from '@bloomskill/table-mui'
import type { BstTableColumn } from '@bloomskill/table-engine'
import '@bloomskill/table-engine/styles.css'
const rows = [{ id:'1', item:'Note', v:'A longer note that wraps across the cell when there is room, or truncates with a tooltip.' }, { id:'2', item:'Short', v:'Brief.' }]
const columns: BstTableColumn<any>[] = [
{ id: 'item', accessorKey: 'item', header: 'Item' },
{ id:'v', accessorKey:'v', header:'Long text', meta:{ type:'longText' } },
]
export default function App() {
return <BstTableMui data={rows} columns={columns} getRowId={(r) => r.id} pagination={false} />
}
Loading live example…

Guide

When to use it

Multi-line prose that doesn't fit on one line — descriptions, notes, comments, addresses.

How it works

Reads the string clamped to a few lines; the adapters open a textarea (and a popup for the full value) to edit. Stored as a string.

Options

  • cellMeta.required — reject an empty value on save.

At a glance

Rendersclamped multi-line text
Value shapestring
Editable✅ textarea → popup (adapters)
Key cellMetarequired

Use it

const columns: BstTableColumn<Row>[] = [
{ id: 'x', accessorKey: 'x', header: 'X', meta: { type: 'longText', /* cellMeta below */ } },
]