bun-types 1.3.2-canary.20251105T140650 → 1.3.2

package/docs/guides/process/{spawn-stderr.md → spawn-stderr.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Read stderr from a child process
+title: Read stderr from a child process
+sidebarTitle: Read stderr
+mode: center
 ---
 
 When using [`Bun.spawn()`](https://bun.com/docs/api/spawn), the child process inherits the `stderr` of the spawning process. If instead you'd prefer to read and handle `stderr`, set the `stderr` option to `"pipe"`.
@@ -8,6 +10,7 @@ When using [`Bun.spawn()`](https://bun.com/docs/api/spawn), the child process in
 const proc = Bun.spawn(["echo", "hello"], {
   stderr: "pipe",
 });
+
 proc.stderr; // => ReadableStream
 ```
 

package/docs/guides/process/{spawn-stdout.md → spawn-stdout.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Read stdout from a child process
+title: Read stdout from a child process
+sidebarTitle: Read stdout
+mode: center
 ---
 
 When using [`Bun.spawn()`](https://bun.com/docs/api/spawn), the `stdout` of the child process can be consumed as a `ReadableStream` via `proc.stdout`.

package/docs/guides/process/{spawn.md → spawn.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Spawn a child process
+title: Spawn a child process
+sidebarTitle: Spawn child process
+mode: center
 ---
 
 Use [`Bun.spawn()`](https://bun.com/docs/api/spawn) to spawn a child process.

package/docs/guides/process/{stdin.md → stdin.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Read from stdin
+title: Read from stdin
+sidebarTitle: Read from stdin
+mode: center
 ---
 
 For CLI tools, it's often useful to read from `stdin`. In Bun, the `console` object is an `AsyncIterable` that yields lines from `stdin`.
 
-```ts#index.ts
+```ts index.ts icon="/icons/typescript.svg"
 const prompt = "Type something: ";
 process.stdout.write(prompt);
 for await (const line of console) {
@@ -17,8 +19,11 @@ for await (const line of console) {
 
 Running this file results in a never-ending interactive prompt that echoes whatever the user types.
 
-```sh
-$ bun run index.ts
+```sh terminal icon="terminal"
+bun run index.ts
+```
+
+```txt
 Type something: hello
 You typed: hello
 Type something: hello again
@@ -31,7 +36,7 @@ Bun also exposes stdin as a `BunFile` via `Bun.stdin`. This is useful for increm
 
 There is no guarantee that the chunks will be split line-by-line.
 
-```ts#stdin.ts
+```ts stdin.ts icon="/icons/typescript.svg"
 for await (const chunk of Bun.stdin.stream()) {
   // chunk is Uint8Array
   // this converts it to text (assumes ASCII encoding)
@@ -44,8 +49,11 @@ for await (const chunk of Bun.stdin.stream()) {
 
 This will print the input that is piped into the `bun` process.
 
-```sh
-$ echo "hello" | bun run stdin.ts
+```sh terminal icon="terminal"
+echo "hello" | bun run stdin.ts
+```
+
+```txt
 Chunk: hello
 ```
 

package/docs/guides/read-file/{arraybuffer.md → arraybuffer.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Read a file to an ArrayBuffer
+title: Read a file to an ArrayBuffer
+sidebarTitle: Read to ArrayBuffer
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob` and allows you to lazily read the file in a variety of formats. Use `.arrayBuffer()` to read the file as an `ArrayBuffer`.
 
-```ts
+```ts index.ts icon="/icons/typescript.svg"
 const path = "/path/to/package.json";
 const file = Bun.file(path);
 
@@ -15,7 +17,7 @@ const buffer = await file.arrayBuffer();
 
 The binary content in the `ArrayBuffer` can then be read as a typed array, such as `Int8Array`. For `Uint8Array`, use [`.bytes()`](./uint8array).
 
-```ts
+```ts index.ts icon="/icons/typescript.svg"
 const buffer = await file.arrayBuffer();
 const bytes = new Int8Array(buffer);
 

package/docs/guides/read-file/{buffer.md → buffer.mdx}

@@ -1,12 +1,14 @@
 ---
-name: Read a file to a Buffer
+title: Read a file to a Buffer
+sidebarTitle: Read to Buffer
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob` and allows you to lazily read the file in a variety of formats.
 
 To read the file into a `Buffer` instance, first use `.arrayBuffer()` to consume the file as an `ArrayBuffer`, then use `Buffer.from()` to create a `Buffer` from the `ArrayBuffer`.
 
-```ts
+```ts index.ts icon="/icons/typescript.svg"
 const path = "/path/to/package.json";
 const file = Bun.file(path);
 

package/docs/guides/read-file/{exists.md → exists.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Check if a file exists
+title: Check if a file exists
+sidebarTitle: Check file exists
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. Use the `.exists()` method to check if a file exists at the given path.
 
-```ts
+```ts index.ts icon="/icons/typescript.svg"
 const path = "/path/to/package.json";
 const file = Bun.file(path);
 

package/docs/guides/read-file/{json.md → json.mdx}

@@ -1,12 +1,14 @@
 ---
-name: Read a JSON file
+title: Read a JSON file
+sidebarTitle: Read JSON file
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob` and allows you to lazily read the file in a variety of formats. Use `.json()` to read and parse the contents of a `.json` file as a plain object.
 
 The MIME type of the `BunFile` will be set accordingly.
 
-```ts
+```ts index.ts icon="/icons/typescript.svg"
 const path = "/path/to/package.json";
 const file = Bun.file(path);
 

package/docs/guides/read-file/{mime.md → mime.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Get the MIME type of a file
+title: Get the MIME type of a file
+sidebarTitle: Get MIME type
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob`, so use the `.type` property to read the MIME type.

package/docs/guides/read-file/{stream.md → stream.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Read a file as a ReadableStream
+title: Read a file as a ReadableStream
+sidebarTitle: Read as stream
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob` and allows you to lazily read the file in a variety of formats. Use `.stream()` to consume the file incrementally as a `ReadableStream`.

package/docs/guides/read-file/{string.md → string.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Read a file as a string
+title: Read a file as a string
+sidebarTitle: Read as string
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob` and allows you to lazily read the file in a variety of formats. Use `.text()` to read the contents as a string.

package/docs/guides/read-file/{uint8array.md → uint8array.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Read a file to a Uint8Array
+title: Read a file to a Uint8Array
+sidebarTitle: Read to Uint8Array
+mode: center
 ---
 
 The `Bun.file()` function accepts a path and returns a `BunFile` instance. The `BunFile` class extends `Blob` and allows you to lazily read the file in a variety of formats.

package/docs/guides/read-file/{watch.md → watch.mdx}

@@ -1,5 +1,7 @@
 ---
-name: Watch a directory for changes
+title: Watch a directory for changes
+sidebarTitle: Watch directory
+mode: center
 ---
 
 Bun implements the `node:fs` module, including the `fs.watch` function for listening for file system changes.
@@ -21,13 +23,9 @@ To listen to changes in subdirectories, pass the `recursive: true` option to `fs
 ```ts
 import { watch } from "fs";
 
-const watcher = watch(
-  import.meta.dir,
-  { recursive: true },
-  (event, relativePath) => {
-    console.log(`Detected ${event} in ${relativePath}`);
-  },
-);
+const watcher = watch(import.meta.dir, { recursive: true }, (event, filename) => {
+  console.log(`Detected ${event} in ${filename}`);
+});
 ```
 
 ---

package/docs/guides/runtime/{build-time-constants.md → build-time-constants.mdx}

@@ -1,11 +1,13 @@
 ---
-name: Build-time constants with --define
+title: Build-time constants with --define
+sidebarTitle: Build-time constants
+mode: center
 ---
 
 The `--define` flag can be used with `bun build` and `bun build --compile` to inject build-time constants into your application. This is especially useful for embedding metadata like build versions, timestamps, or configuration flags directly into your compiled executables.
 
-```sh
-$ bun build --compile --define BUILD_VERSION='"1.2.3"' --define BUILD_TIME='"2024-01-15T10:30:00Z"' src/index.ts --outfile myapp
+```sh terminal icon="terminal"
+bun build --compile --define BUILD_VERSION='"1.2.3"' --define BUILD_TIME='"2024-01-15T10:30:00Z"' src/index.ts --outfile myapp
 ```
 
 ---
@@ -27,21 +29,21 @@ This is similar to `gcc -D` or `#define` in C/C++, but for JavaScript/TypeScript
 
 ### With `bun build`
 
-```sh
+```sh terminal icon="terminal"
 # Bundle with build-time constants
-$ bun build --define BUILD_VERSION='"1.0.0"' --define NODE_ENV='"production"' src/index.ts --outdir ./dist
+bun build --define BUILD_VERSION='"1.0.0"' --define NODE_ENV='"production"' src/index.ts --outdir ./dist
 ```
 
 ### With `bun build --compile`
 
-```sh
+```sh terminal icon="terminal"
 # Compile to executable with build-time constants
-$ bun build --compile --define BUILD_VERSION='"1.0.0"' --define BUILD_TIME='"2024-01-15T10:30:00Z"' src/cli.ts --outfile mycli
+bun build --compile --define BUILD_VERSION='"1.0.0"' --define BUILD_TIME='"2024-01-15T10:30:00Z"' src/cli.ts --outfile mycli
 ```
 
 ### JavaScript API
 
-```ts
+```ts build.ts icon="/icons/typescript.svg"
 await Bun.build({
   entrypoints: ["./src/index.ts"],
   outdir: "./dist",
@@ -61,9 +63,9 @@ await Bun.build({
 
 Embed version and build metadata directly into your executable:
 
-{% codetabs %}
+<CodeGroup>
 
-```ts#src/version.ts
+```ts src/version.ts icon="/icons/typescript.svg"
 // These constants are replaced at build time
 declare const BUILD_VERSION: string;
 declare const BUILD_TIME: string;
@@ -78,21 +80,21 @@ export function getVersion() {
 }
 ```
 
-```sh#Build command
-$ bun build --compile \
+```sh Build command
+bun build --compile \
   --define BUILD_VERSION='"1.2.3"' \
   --define BUILD_TIME='"2024-01-15T10:30:00Z"' \
   --define GIT_COMMIT='"abc123"' \
   src/cli.ts --outfile mycli
 ```
 
-{% /codetabs %}
+</CodeGroup>
 
 ### Feature flags
 
 Use build-time constants to enable/disable features:
 
-```ts
+```ts src/version.ts icon="/icons/typescript.svg"
 // Replaced at build time
 declare const ENABLE_ANALYTICS: boolean;
 declare const ENABLE_DEBUG: boolean;
@@ -111,17 +113,17 @@ if (ENABLE_DEBUG) {
 
 ```sh
 # Production build - analytics enabled, debug disabled
-$ bun build --compile --define ENABLE_ANALYTICS=true --define ENABLE_DEBUG=false src/app.ts --outfile app-prod
+bun build --compile --define ENABLE_ANALYTICS=true --define ENABLE_DEBUG=false src/app.ts --outfile app-prod
 
 # Development build - both enabled
-$ bun build --compile --define ENABLE_ANALYTICS=false --define ENABLE_DEBUG=true src/app.ts --outfile app-dev
+bun build --compile --define ENABLE_ANALYTICS=false --define ENABLE_DEBUG=true src/app.ts --outfile app-dev
 ```
 
 ### Configuration
 
 Replace configuration objects at build time:
 
-```ts
+```ts src/version.ts icon="/icons/typescript.svg"
 declare const CONFIG: {
   apiUrl: string;
   timeout: number;
@@ -135,7 +137,7 @@ const response = await fetch(CONFIG.apiUrl, {
 ```
 
 ```sh
-$ bun build --compile --define 'CONFIG={"apiUrl":"https://api.example.com","timeout":5000,"retries":3}' src/app.ts --outfile app
+bun build --compile --define 'CONFIG={"apiUrl":"https://api.example.com","timeout":5000,"retries":3}' src/app.ts --outfile app
 ```
 
 ---
@@ -162,7 +164,7 @@ Generate build-time constants from shell commands:
 
 ```sh
 # Use git to get current commit and timestamp
-$ bun build --compile \
+bun build --compile \
   --define BUILD_VERSION="\"$(git describe --tags --always)\"" \
   --define BUILD_TIME="\"$(date -u +%Y-%m-%dT%H:%M:%SZ)\"" \
   --define GIT_COMMIT="\"$(git rev-parse HEAD)\"" \
@@ -275,13 +277,13 @@ When building for multiple platforms, constants work the same way:
 
 ```sh
 # Linux
-$ bun build --compile --target=bun-linux-x64 --define PLATFORM='"linux"' src/app.ts --outfile app-linux
+bun build --compile --target=bun-linux-x64 --define PLATFORM='"linux"' src/app.ts --outfile app-linux
 
 # macOS
-$ bun build --compile --target=bun-darwin-x64 --define PLATFORM='"darwin"' src/app.ts --outfile app-macos
+bun build --compile --target=bun-darwin-x64 --define PLATFORM='"darwin"' src/app.ts --outfile app-macos
 
 # Windows
-$ bun build --compile --target=bun-windows-x64 --define PLATFORM='"windows"' src/app.ts --outfile app-windows.exe
+bun build --compile --target=bun-windows-x64 --define PLATFORM='"windows"' src/app.ts --outfile app-windows.exe
 ```
 
 ---

package/docs/guides/{install/cicd.md → runtime/cicd.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Install dependencies with Bun in GitHub Actions
+title: Install and run Bun in GitHub Actions
+sidebarTitle: GitHub Actions
+mode: center
 ---
 
 Use the official [`setup-bun`](https://github.com/oven-sh/setup-bun) GitHub Action to install `bun` in your GitHub Actions runner.
 
-```yaml-diff#workflow.yml
+```yaml workflow.yml icon="file-code"
 name: my-workflow
 jobs:
   my-job:
@@ -13,17 +15,19 @@ jobs:
     steps:
       # ...
       - uses: actions/checkout@v4
-+     - uses: oven-sh/setup-bun@v2
+      - uses: oven-sh/setup-bun@v2 // [!code ++]
 
       # run any `bun` or `bunx` command
-+     - run: bun install
+      - run: bun install // [!code ++]
+      - run: bun index.ts // [!code ++]
+      - run: bun run build // [!code ++]
 ```
 
 ---
 
 To specify a version of Bun to install:
 
-```yaml-diff#workflow.yml
+```yaml workflow.yml icon="file-code"
 name: my-workflow
 jobs:
   my-job:
@@ -32,8 +36,8 @@ jobs:
     steps:
       # ...
       - uses: oven-sh/setup-bun@v2
-+       with:
-+         version: "latest" # or "canary"
+        with: // [!code ++]
+          bun-version: 1.2.0 # or "latest", "canary", <sha> // [!code ++]
 ```
 
 ---

package/docs/guides/runtime/{codesign-macos-executable.md → codesign-macos-executable.mdx}

@@ -1,20 +1,25 @@
 ---
-name: Codesign a single-file JavaScript executable on macOS
+title: Codesign a single-file JavaScript executable on macOS
 description: Fix the "can't be opened because it is from an unidentified developer" Gatekeeper warning when running your JavaScript executable.
+sidebarTitle: Codesign on macOS
+mode: center
 ---
 
 Compile your executable using the `--compile` flag.
 
 ```sh
-$ bun build --compile ./path/to/entry.ts --outfile myapp
+bun build --compile ./path/to/entry.ts --outfile myapp
 ```
 
 ---
 
 List your available signing identities. One of these will be your signing identity that you pass to the `codesign` command. This command requires macOS.
 
-```sh
-$ security find-identity -v -p codesigning
+```sh terminal icon="terminal"
+security find-identity -v -p codesigning
+```
+
+```txt
 1. XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX "Developer ID Application: Your Name (ZZZZZZZZZZ)"
    1 valid identities found
 ```
@@ -23,7 +28,7 @@ $ security find-identity -v -p codesigning
 
 Optional, but recommended: create an `entitlements.plist` file with the necessary permissions for the JavaScript engine to work correctly.
 
-```xml#entitlements.plist
+```xml entitlements.plist icon="file-code"
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
 <plist version="1.0">
@@ -46,11 +51,11 @@ Optional, but recommended: create an `entitlements.plist` file with the necessar
 
 Sign your executable using the `codesign` command and verify it works.
 
-```bash
-$ codesign --entitlements entitlements.plist -vvvv --deep --sign "XXXXXXXXXX" ./myapp --force
-$ codesign -vvv --verify ./myapp
+```bash terminal icon="terminal"
+codesign --entitlements entitlements.plist -vvvv --deep --sign "XXXXXXXXXX" ./myapp --force
+codesign -vvv --verify ./myapp
 ```
 
 ---
 
-For more information on macOS codesigning, refer to [Apple's Code Signing documentation](https://developer.apple.com/documentation/security/code_signing_services). For details about creating single-file executables with Bun, see [Standalone Executables](/docs/bundler/executables). This guide requires Bun v1.2.4 or newer.
+For more information on macOS codesigning, refer to [Apple's Code Signing documentation](https://developer.apple.com/documentation/security/code_signing_services). For details about creating single-file executables with Bun, see [Standalone Executables](/bundler/executables). This guide requires Bun v1.2.4 or newer.

package/docs/guides/runtime/{define-constant.md → define-constant.mdx}

@@ -1,12 +1,14 @@
 ---
-name: Define and replace static globals & constants
+title: Define and replace static globals & constants
+sidebarTitle: Define constants
+mode: center
 ---
 
 The `--define` flag lets you declare statically-analyzable constants and globals. It replace all usages of an identifier or property in a JavaScript or TypeScript file with a constant value. This feature is supported at runtime and also in `bun build`. This is sort of similar to `#define` in C/C++, except for JavaScript.
 
-```sh
-$ bun --define process.env.NODE_ENV="'production'" src/index.ts # Runtime
-$ bun build --define process.env.NODE_ENV="'production'" src/index.ts # Build
+```sh terminal icon="terminal"
+bun --define process.env.NODE_ENV="'production'" src/index.ts # Runtime
+bun build --define process.env.NODE_ENV="'production'" src/index.ts # Build
 ```
 
 ---
@@ -25,12 +27,13 @@ if (process.env.NODE_ENV === "production") {
 
 Before the code reaches the JavaScript engine, Bun replaces `process.env.NODE_ENV` with `"production"`.
 
-```ts-diff
-+ if ("production" === "production") {
-    console.log("Production mode");
-  } else {
-    console.log("Development mode");
-  }
+```ts
+if ("production" === "production") {
+  // [!code ++]
+  console.log("Production mode");
+} else {
+  console.log("Development mode");
+}
 ```
 
 ---
@@ -39,12 +42,13 @@ It doesn't stop there. Bun's optimizing transpiler is smart enough to do some ba
 
 Since `"production" === "production"` is always `true`, Bun replaces the entire expression with the `true` value.
 
-```ts-diff
-+ if (true) {
-    console.log("Production mode");
-  } else {
-    console.log("Development mode");
-  }
+```ts
+if (true) {
+  // [!code ++]
+  console.log("Production mode");
+} else {
+  console.log("Development mode");
+}
 ```
 
 ---

package/docs/guides/runtime/{delete-directory.md → delete-directory.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Delete directories
+title: Delete directories
+sidebarTitle: Delete directories
+mode: center
 ---
 
 To recursively delete a directory and all its contents, use `rm` from `node:fs/promises`. This is like running `rm -rf` in JavaScript.
 
-```ts
+```ts delete-directory.ts icon="/icons/typescript.svg"
 import { rm } from "node:fs/promises";
 
 // Delete a directory and all its contents
@@ -20,7 +22,7 @@ These options configure the deletion behavior:
 
 You can also use it without `force` to ensure the directory exists:
 
-```ts
+```ts delete-directory.ts icon="/icons/typescript.svg"
 try {
   await rm("path/to/directory", { recursive: true });
 } catch (error) {

package/docs/guides/runtime/{delete-file.md → delete-file.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Delete files
+title: Delete files
+sidebarTitle: Delete files
+mode: center
 ---
 
 To delete a file, use `Bun.file(path).delete()`.
 
-```ts
+```ts delete-file.ts icon="/icons/typescript.svg"
 // Delete a file
 const file = Bun.file("path/to/file.txt");
 await file.delete();

package/docs/guides/runtime/{heap-snapshot.md → heap-snapshot.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Inspect memory usage using V8 heap snapshots
+title: Inspect memory usage using V8 heap snapshots
+sidebarTitle: Heap snapshots
+mode: center
 ---
 
 Bun implements V8's heap snapshot API, which allows you to create snapshots of the heap at runtime. This helps debug memory leaks in your JavaScript/TypeScript application.
 
-```ts#snapshot.ts
+```ts snapshot.ts icon="/icons/typescript.svg"
 import v8 from "node:v8";
 
 // Creates a heap snapshot file with an auto-generated name
@@ -23,4 +25,4 @@ To view V8 heap snapshots in Chrome DevTools:
 3. Click the "Load" button (folder icon)
 4. Select your `.heapsnapshot` file
 
-{% image src="/images/chrome-devtools-memory.png" alt="Chrome DevTools Memory Tab" width="100%" /%}
+<Frame>![Chrome DevTools Memory Tab](/images/chrome-devtools-memory.png)</Frame>

package/docs/guides/runtime/{import-html.md → import-html.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Import a HTML file as text
+title: Import a HTML file as text
+sidebarTitle: Import HTML
+mode: center
 ---
 
 To import a `.html` file in Bun as a text file, use the `type: "text"` attribute in the import statement.
 
-```ts
+```ts file.ts icon="/icons/typescript.svg"
 import html from "./file.html" with { type: "text" };
 
 console.log(html); // <!DOCTYPE html><html><head>...

package/docs/guides/runtime/{import-json.md → import-json.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Import a JSON file
+title: Import a JSON file
+sidebarTitle: Import JSON
+mode: center
 ---
 
 Bun natively supports `.json` imports.
 
-```json#package.json
+```json package.json icon="file-json"
 {
   "name": "bun",
   "version": "1.0.0",
@@ -19,7 +21,7 @@ Bun natively supports `.json` imports.
 
 Import the file like any other source file.
 
-```ts
+```ts data.ts icon="/icons/typescript.svg"
 import data from "./package.json";
 
 data.name; // => "bun"
@@ -31,7 +33,7 @@ data.author.name; // => "John Dough"
 
 Bun also supports [Import Attributes](https://github.com/tc39/proposal-import-attributes/) and [JSON modules](https://github.com/tc39/proposal-json-modules) syntax.
 
-```ts
+```ts data.ts icon="/icons/typescript.svg"
 import data from "./package.json" with { type: "json" };
 
 data.name; // => "bun"

package/docs/guides/runtime/{import-toml.md → import-toml.mdx}

@@ -1,10 +1,12 @@
 ---
-name: Import a TOML file
+title: Import a TOML file
+sidebarTitle: Import TOML
+mode: center
 ---
 
 Bun natively supports importing `.toml` files.
 
-```toml#data.toml
+```toml data.toml icon="file-code"
 name = "bun"
 version = "1.0.0"
 
@@ -17,7 +19,7 @@ email = "john@dough.com"
 
 Import the file like any other source file.
 
-```ts
+```ts data.ts icon="/icons/typescript.svg"
 import data from "./data.toml";
 
 data.name; // => "bun"