hyperlink

anchor.

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:'Docs', v:'https://bst-grid.pages.dev' }, { id:'2', item:'Repo', v:'https://example.com' }]
const columns: BstTableColumn<any>[] = [
  { id: 'item', accessorKey: 'item', header: 'Item' },
  { id:'v', accessorKey:'v', header:'Link', meta:{ type:'hyperlink' } },
]
export default function App() {
  return <BstTableMui data={rows} columns={columns} getRowId={(r) => r.id} pagination={false} />
}

Loading live example…

Guide

When to use it

A clickable URL — a website, document, or record link.

How it works

Reads a string URL, or { href, label } for custom link text, and renders an anchor. Editing swaps in a URL input.

Options

• cellMeta.target — the anchor target (default '_blank').

At a glance

Renders	anchor
Value shape	string or { href, label }
Editable	✅ url input
Key cellMeta	target

Use it

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

cellMeta options

hyperlink

cellMeta	Type	Effect
target	string	Anchor target. Default '_blank'.