Runtime settings sheet

Prop showSettings — adapter chrome, default false.

Guide

When to use it

Let end-users turn this grid's features on and off themselves at runtime — no code, no redeploy — with the choice persisted per table.

How it works

Adds a gear that opens a side sheet (MUI Drawer / shadcn slide-over) listing every instance-level boolean toggle, grouped (Data ops · Columns · Rows · Editing · Selection & clipboard · Display · …) from BST_SETTINGS_REGISTRY. Choices save to localStorage. boolean | BstSettingsOptions (e.g. { search: true } for a filter box). A toggle whose prerequisite is off renders disabled ("Needs <parent>").

Gotchas

• Only features you've provisioned appear — e.g. turn Copy & paste off to disable clipboard, no code change.
• It persists feature toggles; the separate gridState handles the saved view (sort / filters / column layout).

Live example

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'

type Row = { id: string; name: string; team: string; role: string; score: number }
const seed: Row[] = [
  { id: '1', name: 'Ada Lovelace',   team: 'Platform', role: 'Engineer', score: 92 },
  { id: '2', name: 'Alan Turing',    team: 'Research', role: 'Scientist', score: 88 },
  { id: '3', name: 'Grace Hopper',   team: 'Platform', role: 'Engineer', score: 95 },
  { id: '4', name: 'Katherine J.',   team: 'Research', role: 'Analyst',  score: 90 },
  { id: '5', name: 'Edsger Dijkstra',team: 'Platform', role: 'Architect',score: 84 },
]
const columns: BstTableColumn<Row>[] = [
  { id: 'name',  accessorKey: 'name',  header: 'Name' },
  { id: 'team',  accessorKey: 'team',  header: 'Team' },
  { id: 'role',  accessorKey: 'role',  header: 'Role' },
  { id: 'score', accessorKey: 'score', header: 'Score', sortFn: 'basic' },
]

export default function App() {
  return (
    <BstTableMui data={seed} columns={columns} getRowId={(r) => r.id}
      showSettings enableColumnPinning enableRowSelection />
  )
}

Loading live example…

Live example

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'
type Row = { id: string; name: string; team: string; role: string; score: number }
const seed: Row[] = [
  { id: '1', name: 'Ada Lovelace',    team: 'Platform', role: 'Engineer',  score: 92 },
  { id: '2', name: 'Alan Turing',     team: 'Research', role: 'Scientist', score: 88 },
  { id: '3', name: 'Grace Hopper',    team: 'Platform', role: 'Engineer',  score: 95 },
  { id: '4', name: 'Katherine J.',    team: 'Research', role: 'Analyst',   score: 90 },
  { id: '5', name: 'Edsger Dijkstra', team: 'Platform', role: 'Architect', score: 84 },
]
const columns: BstTableColumn<Row>[] = [
  { id: 'name', accessorKey: 'name', header: 'Name' },
  { id: 'team', accessorKey: 'team', header: 'Team' },
  { id: 'role', accessorKey: 'role', header: 'Role' },
  { id: 'score', accessorKey: 'score', header: 'Score', sortFn: 'basic' },
]
export default function App() {
  return (
    <BstTableMui data={seed} columns={columns} getRowId={(r) => r.id}
      showSettings enableColumnPinning enableRowSelection enableCellSelection />
  )
}

Loading live example…

Overview

Layer	show* (chrome, resolved in the adapter)
Type	boolean | BstSettingsOptions
Default	false
Maps to	adapter gear → sheet (MUI Drawer / shadcn slide-over); engine useBstSettings resolves overrides → per-table enable/show, persisted to localStorage. Covers every instance-level boolean toggle via BSTSETTINGSREGISTRY (grouped: Data ops · Columns · Rows · Editing · Selection & clipboard · Display) — keep in sync per "settings-sheet parity" above. Sheet chrome: highlighted header band, divider-separated sections with prominent uppercase headings, and a search box (BstSettingsOptions.search, auto for 30+ lists) filtering by label/hint/group via the shared pure helpers filterSettingsGroups / shouldShowSettingsSearch. Dependency cascade: a toggle whose prerequisite is off renders disabled ("Needs <parent>"), transitive + reversible — via requires edges on the registry (mirror packages/mcp/src/rules.ts) resolved by the pure export isSettingActive; in-section parent→child pairs also draw a dotted branch connector (git-graph style) via parentKey/lastChild on BstSettingsItem
Status	✅ done
Since	v0.11.0

Enable it

<BstTableMui
  data={rows}
  columns={columns}
  showSettings
/>

Swap BstTableMui for BstTableShadcn (and the CSS import) for the shadcn skin — same props.

Behavior & interactions

• Renders a gear → a sheet where END-USERS flip this grid's features on/off at runtime, persisted to localStorage.
• Chrome flag: it only renders its control when the matching enable* behaviour is on.