diff --git a/bun.lockb b/bun.lockb index 17f6852..c656c32 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/examples/astro/astro.config.ts b/examples/astro/astro.config.ts index 7d50af8..56b2265 100644 --- a/examples/astro/astro.config.ts +++ b/examples/astro/astro.config.ts @@ -1,6 +1,3 @@ -import 'dotenv/config'; -Object.assign(process.env, { ASTRO_TELEMETRY_DISABLED: 1 }); - import mdx from '@astrojs/mdx'; import tailwind from '@astrojs/tailwind'; import { defineConfig } from 'astro/config'; diff --git a/package.json b/package.json index 0157026..f4a57b6 100644 --- a/package.json +++ b/package.json @@ -14,13 +14,10 @@ }, "./package.json": "./package.json" }, - "files": [ - "dist", - "package.json" - ], + "files": ["dist", "package.json"], "scripts": { "build": "tsup --config=tsup.config.ts", - "test": "vitest", + "test": "vitest --run", "format": "biome format . --write", "lint": "biome check --apply .", "typecheck": "tsc --project tsconfig.json --noEmit", @@ -34,7 +31,7 @@ "check-package": "bunx publint@latest --strict && bunx @arethetypeswrong/cli --pack --ignore-rules cjs-resolves-to-esm" }, "dependencies": { - "@types/hast": "^3.0.3", + "@types/hast": "^3.0.4", "hast-util-to-string": "^3.0.0", "parse-numeric-range": "^1.3.0", "rehype-parse": "^9.0.0", @@ -43,35 +40,30 @@ }, "devDependencies": { "@biomejs/biome": "^1.5.3", - "@types/bun": "^1.0.3", - "@types/node": "^20.11.5", + "@types/bun": "^1.0.5", + "@types/node": "^20.11.16", "bumpp": "^9.3.0", - "bun": "^1.0.25", + "bun": "^1.0.26", "hast-util-to-html": "^9.0.0", - "husky": "^8.0.3", + "husky": "^9.0.10", "mdast-util-to-hast": "^13.1.0", - "prettier": "^3.2.4", + "prettier": "^3.2.5", "remark": "^15.0.1", "tsup": "^8.0.1", "typescript": "^5.3.3", "vite": "^5.0.12", - "vitest": "^1.2.1", - "shikiji": "^0.10.0", - "shikiji-transformers": "^0.10.0" + "vitest": "^1.2.2", + "@shikijs/transformers": "^1.0.0", + "shiki": "^1.0.0" }, "peerDependencies": { - "shikiji": "^0.7.0 || ^0.8.0 || ^0.9.0 || ^0.10.0" + "shiki": "^1.0.0" }, "engines": { "node": ">=18" }, - "browserslist": [ - "node 18" - ], + "repository": "github:rehype-pretty/rehype-pretty-code", + "browserslist": ["node 18"], "author": "https://github.com/atomiks", - "license": "MIT", - "repository": { - "type": "git", - "url": "git+https://github.com/atomiks/rehype-pretty-code.git" - } + "license": "MIT" } diff --git a/src/index.ts b/src/index.ts index a234e84..4d4d5b5 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,12 +1,14 @@ import type { Element, ElementContent, ElementData, Root } from 'hast'; -import type { Options, Theme } from './types'; -import type { CharsHighlighterOptions } from './types'; -import type { Highlighter, CodeToHastOptions } from 'shikiji'; +import type { Options, Theme, CharsHighlighterOptions } from './types'; +import { + type Highlighter, + type CodeToHastOptions, + getHighlighter as defaultGetHighlighter, +} from 'shiki'; import type { Transformer } from 'unified'; import { visit } from 'unist-util-visit'; import { toString as hastToString } from 'hast-util-to-string'; import rangeParser from 'parse-numeric-range'; -import { getHighlighter as defaultGetHighlighter } from 'shikiji'; import { unified } from 'unified'; import rehypeParse from 'rehype-parse'; import { charsHighlighter } from './chars/charsHighlighter'; diff --git a/src/types.ts b/src/types.ts index c882ce2..91ec0a1 100644 --- a/src/types.ts +++ b/src/types.ts @@ -3,8 +3,8 @@ import type { Highlighter, BuiltinTheme, ThemeRegistrationRaw, - ShikijiTransformer, -} from 'shikiji'; + ShikiTransformer, +} from 'shiki'; import type { Element, Properties, Text } from 'hast'; export type LineElement = Omit & { @@ -24,7 +24,7 @@ export interface Options { keepBackground?: boolean; defaultLang?: string | { block?: string; inline?: string }; tokensMap?: Record; - transformers?: ShikijiTransformer[]; + transformers?: ShikiTransformer[]; filterMetaString?(str: string): string; getHighlighter?( options: BundledHighlighterOptions, diff --git a/src/utils.ts b/src/utils.ts index e3ed8a1..d5df199 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -1,6 +1,6 @@ import type { Theme } from './types'; import type { Element, ElementContent, Root, RootContent, Text } from 'hast'; -import type { ThemeRegistrationRaw } from 'shikiji'; +import type { ThemeRegistrationRaw } from 'shiki'; import rangeParser from 'parse-numeric-range'; export function isJSONTheme(value: any): value is ThemeRegistrationRaw { @@ -55,6 +55,7 @@ export function parseBlockMetaString( defaultFallback: string, ) { let meta = filter( + // @ts-expect-error: TODO handle this (element.data?.meta ?? element.properties?.metastring ?? '') as string, ); diff --git a/test/fixtures.test.js b/test/fixtures.test.js index 04724cc..e91fc1b 100644 --- a/test/fixtures.test.js +++ b/test/fixtures.test.js @@ -5,10 +5,10 @@ import { toHtml } from 'hast-util-to-html'; import { toHast } from 'mdast-util-to-hast'; import { dirname, join, parse } from 'node:path'; import { remark } from 'remark'; -import { getHighlighter as shikiHighlighter } from 'shikiji'; +import { getHighlighter as shikiHighlighter } from 'shiki'; import { fileURLToPath } from 'node:url'; import qs from 'node:querystring'; -import { transformerNotationDiff } from 'shikiji-transformers'; +import { transformerNotationDiff } from '@shikijs/transformers'; import prettier from 'prettier'; const __filename = fileURLToPath(import.meta.url); diff --git a/tsconfig.json b/tsconfig.json index 33add33..7fc9a3f 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -17,7 +17,7 @@ "baseUrl": ".", "downlevelIteration": true }, - "include": ["src/**/*", "scripts", "index.d.ts"], + "include": ["src/**/*", "scripts", "index.d.ts", "./scripts"], "files": ["tsup.config.ts"], "exclude": ["node_modules"] } diff --git a/website/src/app/index.mdx b/website/src/app/index.mdx index 1423b82..6fc9ec4 100644 --- a/website/src/app/index.mdx +++ b/website/src/app/index.mdx @@ -1,7 +1,7 @@ {/* prettier-ignore */}
[`rehype-pretty-code`](https://github.com/atomiks/rehype-pretty-code) is a Rehype plugin powered by the - [`shikiji`](https://github.com/antfu/shikiji) syntax highlighter that provides beautiful code blocks for Markdown or MDX. It works on both the server at build-time (avoiding runtime syntax highlighting) and on the client for dynamic highlighting. + [`shiki`](https://github.com/shikijs/shiki) syntax highlighter that provides beautiful code blocks for Markdown or MDX. It works on both the server at build-time (avoiding runtime syntax highlighting) and on the client for dynamic highlighting.
## Editor-Grade Highlighting @@ -119,11 +119,11 @@ Inline ANSI: `> Local: http://localhost:3000/{:ansi}` Install via your terminal: ```shell -npm install rehype-pretty-code shikiji@^0.9.0 +npm install rehype-pretty-code shiki ``` -This package is ESM-only and currently supports `shikiji{:.string}` -`^0.7.0 - ^0.9.0{:.string}`. +This package is ESM-only and currently supports `shiki{:.string}` +`^1.0.0{:.string}`. > To use the latest version in Next.js, ensure your config file is `ESM`: > `next.config.mjs`. Here's a full example: @@ -220,7 +220,7 @@ interface Options { keepBackground?: boolean; defaultLang?: string | { block?: string; inline?: string }; tokensMap?: Record; - transformers?: ShikijiTransformer[]; + transformers?: ShikiTransformer[]; filterMetaString?(str: string): string; getHighlighter?(options: BundledHighlighterOptions): Promise; onVisitLine?(element: LineElement): void; @@ -246,8 +246,8 @@ const options = { ### `theme{:.meta.object-literal.key}` -The default theme is `github-dark-dimmed{:.string}`. Shikiji has a bunch of -[pre-packaged themes](https://github.com/antfu/shikiji/blob/main/docs/themes.md), +The default theme is `github-dark-dimmed{:.string}`. Shiki has a bunch of +[pre-packaged themes](https://shiki.style/themes#themes), which can be specified as a plain string: ```js @@ -302,14 +302,14 @@ const options = { ### `transformers{:.meta.object-literal.key}` -[Transformers](https://github.com/antfu/shikiji#hast-transformers) are a -Shikiji-native way to manipulate the `hAST` tree of the code blocks and further +[Transformers](https://shiki.style/guide/transformers#transformers) are a +Shiki-native way to manipulate the `hAST` tree of the code blocks and further extend the behavior of this plugin. The -[`shikiji-transformers`](https://www.npmjs.com/package/shikiji-transformers) +[`@shikijs/transformers`](https://npm.im/@shikijs/transformers) package provides some useful transformers. ```js -import { transformerNotationDiff } from "shikiji-transformers"; +import { transformerNotationDiff } from '@shikijs/transformers'; const options = { transformers: [transformerNotationDiff()], @@ -544,7 +544,7 @@ const options = { Now, use the following CSS to display the variable colors — if a space is found in the theme name, then CSS variable keys based on the object are available -([more info](https://github.com/antfu/shikiji#lightdark-dual-themes)): +([more info](https://shiki.style/guide/dual-themes#light-dark-dual-themes)): ```scss code[data-theme*=" "], @@ -598,10 +598,10 @@ const options = { To completely configure the highlighter, use the `getHighlighter{:.entity.name.function}` option. This is helpful if you'd like -to configure other Shikiji options, such as `langs{:.meta.object-literal.key}`. +to configure other Shiki options, such as `langs{:.meta.object-literal.key}`. ```js -import { getHighlighter } from "shikiji"; +import { getHighlighter } from "shiki"; const options = { getHighlighter: (options) =>