Tokenized Line

const user = await fetchUser("42");
About this piece

Tokenized Line

Single-line snippet with keywords, strings, and function names colored by semantic token kind.

Usage

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

import { Code5 } from "@/components/beste/piece/code5";

<Code5
  tokens={[
    {
      "kind": "keyword",
      "text": "const"
    },
    {
      "kind": "plain",
      "text": " "
    },
    {
      "kind": "var",
      "text": "user"
    },
    {
      "kind": "plain",
      "text": " = "
    },
    {
      "kind": "keyword",
      "text": "await"
    },
    {
      "kind": "plain",
      "text": " "
    },
    {
      "kind": "fn",
      "text": "fetchUser"
    },
    {
      "kind": "punct",
      "text": "("
    },
    {
      "kind": "string",
      "text": "\"42\""
    },
    {
      "kind": "punct",
      "text": ");"
    }
  ]}
  bordered={false}
/>

More Code pieces

View all Code
const greeting = "Hello, Beste!";ts
{
"name":"Beste",
"active":true,
"count":42
}
SELECT id, name, email
FROM users
WHERE active = true
ORDER BY created_at DESC
LIMIT 10;
members.ts
import { Sirius } from '@sirius/sdk'
 
const client = new Sirius(apiKey)
await client.members.create({ name })
function greet(name) {
return 'Hi ' + name;
return `Hello, ${name}!`;
}
greet.ts
export function greet(name: string) {
  return `Hello, ${name}!`;
}
 
console.log(greet("Beste"));