richText

sanitized-HTML preview or formatted.

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:'Formatted', v:'<b>Bold</b> and <i>italic</i>' }, { id:'2', item:'Plain', v:'Plain text' }]
const columns: BstTableColumn<any>[] = [
  { id: 'item', accessorKey: 'item', header: 'Item' },
  { id:'v', accessorKey:'v', header:'Rich text', meta:{ type:'richText', cellMeta:{ render:'html' } } },
]
export default function App() {
  return <BstTableMui data={rows} columns={columns} getRowId={(r) => r.id} pagination={false} />
}

Loading live example…

Guide

When to use it

Formatted text — bold, italics, lists — stored as HTML.

How it works

Reads an HTML string. By default it shows a safe one-line plain-text preview; set cellMeta.render: 'html' to show the sanitized formatted content. The adapters open a toolbar + popup editor, and input is sanitized in both directions.

Options

• cellMeta.render — 'text' (default, safe plain preview) | 'html' (formatted).

At a glance

Renders	sanitized-HTML preview or formatted
Value shape	HTML string
Editable	✅ toolbar → popup (adapters)
Key cellMeta	render

Use it

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

cellMeta options

richText

cellMeta	Type	Effect
render	'text' | 'html'	'text' (default) = safe one-line plain preview; 'html' = show the sanitized HTML formatted (bold / lists / …).