Skip to content

Commit b94a91d

Browse files
hippotastichippotastic
authored
Add /hast export, add SSR support, allow plain objects as annotations (#187)
* Add `/hast` export to core, expressive-code and all integrations * Add utils to hast export & use them in all packages * Update code to reflect breaking changes in hast * Apply remaining type fixes * Use hast Element instead of Parents wherever possible * Add visit and visitParents utilities to hast export, remove fromHtml due to size * Add changeset * Mark potentially breaking changes * Allow annotations to be defined as plain objects * Replace node imports to support SSR, add Cloudflare draft test * Finally make SSR prerendering work * Remove injected routes entirely * Fix virtual API resolving issues * Add changesets
1 parent 643d478 commit b94a91d

78 files changed

Lines changed: 1686 additions & 713 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.changeset/eight-yaks-trade.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
---
2+
'@expressive-code/plugin-collapsible-sections': minor
3+
'@expressive-code/plugin-line-numbers': minor
4+
'@expressive-code/plugin-text-markers': minor
5+
'@expressive-code/plugin-frames': minor
6+
'@expressive-code/plugin-shiki': minor
7+
'remark-expressive-code': minor
8+
'@expressive-code/core': minor
9+
'astro-expressive-code': minor
10+
'expressive-code': minor
11+
---
12+
13+
- Updates dependencies `hast`, `hastscript` and `hast-util-*` to the latest versions.
14+
15+
**Potentially breaking change:** Unfortunately, some of the new `hast` types are incompatible with their old versions. If you created custom plugins to manipulate HAST nodes, you may need to update your dependencies as well and probably change some types. For example, if you were using the `Parent` type before, you will probably need to replace it with `Parents` or `Element` in the new version.
16+
17+
- Adds a new `/hast` entrypoint to `@expressive-code/core`, `expressive-code`, `remark-expressive-code` and `astro-expressive-code` to simplify plugin development.
18+
19+
This new entrypoint provides direct access to the correct versions of HAST types and commonly used tree traversal, querying and manipulation functions. Instead of having to add your own dependencies on libraries like `hastscript`, `hast-util-select` or `unist-util-visit` to your project and manually keeping them in sync with the versions used by Expressive Code, you can now import the internally used functions and types directly from this new entrypoint.

‎.changeset/red-flies-report.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
'astro-expressive-code': minor
3+
---
4+
5+
Ensures that static assets (styles and JS modules) are prerendered when using SSR adapters. Thank you @alexanderniebuhr!
6+
7+
To achieve this, the previous approach of using `injectRoute` was dropped and the assets are now being handled by the Vite plugin.

‎.changeset/six-lobsters-suffer.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
'astro-expressive-code': minor
3+
---
4+
5+
Makes `astro-expressive-code` compatible with SSR adapters.
6+
7+
To achieve this, the code responsible for loading the optional `ec.config.mjs` file was replaced with a new version that no longer requires any Node.js-specific functionality.

‎.changeset/swift-trees-sniff.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,6 @@
99
'expressive-code': minor
1010
---
1111

12-
Since this version, all packages are only distributed in modern ESM format, which greatly reduces bundle size.
12+
**Potentially breaking change:** Since this version, all packages are only distributed in modern ESM format, which greatly reduces bundle size.
1313

1414
Most projects should not be affected by this change at all, but in case you still need to import Expressive Code packages into a CommonJS project, you can use the widely supported `await import(...)` syntax.

‎.changeset/unlucky-papayas-play.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@expressive-code/core': minor
3+
---
4+
5+
Allows annotations to be defined as plain objects without the need to extend a class, as long as they have all properties required by `ExpressiveCodeAnnotation`.

‎docs/package.json‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,6 @@
2424
"expressive-code": "workspace:^",
2525
"github-slugger": "^2.0.0",
2626
"glob": "^10.3.10",
27-
"hast-util-to-html": "^8.0.4",
28-
"hastscript": "^7.2.0",
2927
"mdast-util-from-markdown": "^2.0.0",
3028
"mdast-util-to-markdown": "^2.1.0",
3129
"mdast-util-to-string": "^4.0.0",

‎docs/plugins/plugin-error-preview.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
// @ts-check
22
import { ExpressiveCodeAnnotation } from '@expressive-code/core'
3-
import { h } from 'hastscript'
3+
import { h } from '@expressive-code/core/hast'
44

55
class SquigglesAnnotation extends ExpressiveCodeAnnotation {
66
/** @param {import('@expressive-code/core').AnnotationRenderOptions} context */

‎docs/src/components/ThemePreview.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
import { ExpressiveCode, loadShikiTheme, type BundledShikiTheme, setProperty } from 'expressive-code'
3-
import { toHtml } from 'hast-util-to-html'
3+
import { toHtml } from 'expressive-code/hast'
44
55
interface Props {
66
theme: string

‎docs/src/content/docs/reference/core-api.mdx‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ In Expressive Code, all processing of your code blocks and their metadata is per
9292
<dt>renderedGroupAst</dt>
9393
<dd>
9494
<PropertySignature>
95-
- Type: `Parent`
95+
- Type: `Element`
9696
</PropertySignature>
9797
</dd>
9898
<dt>renderedGroupContents</dt>
@@ -816,6 +816,8 @@ An abstract class representing a single annotation attached to a code line.
816816
You can develop your own annotations by extending this class and providing implementations for its abstract methods. See the implementation of the
817817
[InlineStyleAnnotation](/reference/core-api/#inlinestyleannotation) class for an example.
818818

819+
You can also define your annotations as plain objects, as long as they have the same properties as this class. This allows you to use annotations in a more functional way, without the need to extend a class.
820+
819821
#### Constructors
820822

821823
:::note
@@ -827,7 +829,7 @@ You should create a subclass that extends `ExpressiveCodeAnnotation` instead.
827829

828830
##### `abstract` render()
829831

830-
- <code class="function-signature">**abstract** **render**(options): Parent[]</code>
832+
- <code class="function-signature">**abstract** **render**(options): Parents[]</code>
831833

832834
Renders the annotation by transforming the provided nodes.
833835

@@ -895,7 +897,7 @@ consule.log('Hello world!')
895897

896898
##### render()
897899

898-
- <code class="function-signature">**render**(options): Parent[]</code>
900+
- <code class="function-signature">**render**(options): Parents[]</code>
899901

900902
Renders the annotation by transforming the provided nodes.
901903

@@ -966,7 +968,7 @@ the entire list.
966968
<dt>nodesToTransform</dt>
967969
<dd>
968970
<PropertySignature>
969-
- Type: `Parent`[]
971+
- Type: `Parents`[]
970972
</PropertySignature>
971973
</dd>
972974
</dl>

‎docs/src/content/docs/reference/plugin-hooks.mdx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -416,7 +416,7 @@ This is the only property that allows you to modify the wrapper element of the e
416416
<dt>groupAst</dt>
417417
<dd>
418418
<PropertySignature>
419-
- Type: `Parent`
419+
- Type: `Element`
420420
</PropertySignature>
421421
</dd>
422422
</dl>

0 commit comments

Comments
 (0)