Skip to content

Commit

Permalink
Add support for Starlight 0.32
Browse files Browse the repository at this point in the history
  • Loading branch information
trueberryless committed Feb 21, 2025
1 parent 073eafa commit 3656c8f
Show file tree
Hide file tree
Showing 11 changed files with 392 additions and 959 deletions.
11 changes: 11 additions & 0 deletions .changeset/dirty-bobcats-taste.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
---
"starlight-plugin-show-latest-version": minor
---

⚠️ **BREAKING CHANGE:** The minimum supported version of Starlight is now version `0.32.0`.

Please use the `@astrojs/upgrade` command to upgrade your project:

```sh
npx @astrojs/upgrade
```
5 changes: 5 additions & 0 deletions .changeset/new-coats-wink.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"starlight-plugin-show-latest-version-docs": patch
---

Update documenation `/components` because the notes were too large
12 changes: 6 additions & 6 deletions docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,13 @@
"start": "astro dev"
},
"dependencies": {
"@astrojs/node": "^9.0.2",
"@astrojs/starlight": "^0.31.1",
"@trueberryless-org/starlight-plugins-docs-components": "^0.3.0",
"astro": "^5.1.10",
"@astrojs/node": "^9.1.0",
"@astrojs/starlight": "^0.32.0",
"@trueberryless-org/starlight-plugins-docs-components": "^0.4.1",
"astro": "^5.3.0",
"sharp": "^0.33.5",
"starlight-contributor-list": "^0.2.0",
"starlight-links-validator": "^0.14.1",
"starlight-contributor-list": "^0.2.1",
"starlight-links-validator": "^0.14.3",
"starlight-plugin-show-latest-version": "workspace:*"
},
"packageManager": "[email protected]",
Expand Down
48 changes: 40 additions & 8 deletions docs/src/content/docs/components.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,24 @@ import Version from "starlight-plugin-show-latest-version/components/Version.ast

</Preview>

:::note
If no version is available it has a default fallback content (`N/A`) which can be customized by [slotting](https://docs.astro.build/en/basics/astro-components/#slots) in the content:

```mdx
import Version from "starlight-plugin-show-latest-version/components/Version.astro";

<Version>
<span slot="fallback">Loading...</span>
</Version>
```

<Preview>

<Version>
<span slot="fallback">Loading...</span>
</Version>

</Preview>

You can opt-in to use the [`server:defer`](https://docs.astro.build/en/reference/directives-reference/#serverdefer) directive to delay rendering until the content of the component is available if a [server adapter](https://docs.astro.build/en/guides/on-demand-rendering/#server-adapters) is configured. This is the recommended approach if your docs do not get rebuilt every time a new version is released.

```mdx
Expand All @@ -41,7 +58,7 @@ import Version from "starlight-plugin-show-latest-version/components/Version.ast

</Preview>

We also recommend [adding a fallback content](https://docs.astro.build/en/guides/server-islands/#server-island-fallback-content) which will be displayed while the component is loading.
Of course, you can also add a custom fallback content which will be displayed while the component is loading:

```mdx
import Version from "starlight-plugin-show-latest-version/components/Version.astro";
Expand All @@ -58,7 +75,6 @@ import Version from "starlight-plugin-show-latest-version/components/Version.ast
</Version>

</Preview>
:::

### VersionBadge

Expand All @@ -78,7 +94,24 @@ import VersionBadge from "starlight-plugin-show-latest-version/components/Versio

</Preview>

:::note
If no version is available it has a default fallback content (`N/A`) which can be customized by [slotting](https://docs.astro.build/en/basics/astro-components/#slots) in the content:

```mdx
import VersionBadge from "starlight-plugin-show-latest-version/components/Version.astro";

<VersionBadge>
<Badge text={"Loading..."} variant="default" size="medium" slot="fallback" />
</VersionBadge>
```

<Preview>

<VersionBadge>
<Badge text={"Loading..."} variant="default" size="medium" slot="fallback" />
</VersionBadge>

</Preview>

You can opt-in to use the [`server:defer`](https://docs.astro.build/en/reference/directives-reference/#serverdefer) directive to delay rendering until the content of the component is available if a [server adapter](https://docs.astro.build/en/guides/on-demand-rendering/#server-adapters) is configured. This is the recommended approach if your docs do not get rebuilt every time a new version is released.

```mdx
Expand All @@ -93,21 +126,20 @@ import VersionBadge from "starlight-plugin-show-latest-version/components/Versio

</Preview>

We also recommend [adding a fallback content](https://docs.astro.build/en/guides/server-islands/#server-island-fallback-content) which will be displayed while the component is loading.
Of course, you can also add a custom fallback content which will be displayed while the component is loading:

```mdx
import VersionBadge from "starlight-plugin-show-latest-version/components/Version.astro";

<VersionBadge server:defer>
<Badge text={"      "} variant="default" size="medium" slot="fallback" />
<Badge text={"Loading..."} variant="default" size="medium" slot="fallback" />
</VersionBadge>
```

<Preview>

<VersionBadge server:defer>
<Badge text={"      "} variant="default" size="medium" slot="fallback" />
<Badge text={"Loading..."} variant="default" size="medium" slot="fallback" />
</VersionBadge>

</Preview>
:::
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
---
import pluginConfig from 'virtual:starlight-plugin-show-latest-version-config';
import VersionBadge from '../components/VersionBadge.astro';
---

{pluginConfig.showInSiteTitle === "true" && (
<VersionBadge />
)}
{pluginConfig.showInSiteTitle === "deferred" && (
<VersionBadge server:defer />
)}

{(pluginConfig.showInSiteTitle === "true" || pluginConfig.showInSiteTitle === "deferred") && (
<style is:global>
.title-wrapper {
display: flex;
align-items: center;
gap: 1rem;
}
</style>
)}
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,11 @@ const version = await fetchVersion(pluginConfig);
---

{version.versionAvailable && (
<span>{version.version}</span>
<span>{version.version}</span>
)}
{!version.versionAvailable && (
<span>N/A</span>
{!version.versionAvailable && !Astro.slots.has('fallback') && (
<span>N/A</span>
)}
{!version.versionAvailable && Astro.slots.has('fallback') && (
<slot name='fallback' />
)}
Original file line number Diff line number Diff line change
Expand Up @@ -9,24 +9,29 @@ const sourceUrl = releasePageUrls[pluginConfig.source.type](pluginConfig.source.
---

{version.versionAvailable && (
<starlight-plugin-show-latest-version>
<a href={sourceUrl} id="starlight-plugin-show-latest-version-link">
<Badge text={version.version} variant={pluginConfig.badge.variant} size={pluginConfig.badge.size} id='starlight-plugin-show-latest-version-badge'/>
</a>
</starlight-plugin-show-latest-version>
<starlight-plugin-show-latest-version>
<a href={sourceUrl} id="starlight-plugin-show-latest-version-link">
<Badge text={version.version} variant={pluginConfig.badge.variant} size={pluginConfig.badge.size} id='starlight-plugin-show-latest-version-badge'/>
</a>
</starlight-plugin-show-latest-version>
)}
{!version.versionAvailable && (
<starlight-plugin-show-latest-version>
<a href={sourceUrl} id="starlight-plugin-show-latest-version-link">
<Badge text="N/A" variant={pluginConfig.badge.variant} size={pluginConfig.badge.size} id='starlight-plugin-show-latest-version-badge'/>
</a>
</starlight-plugin-show-latest-version>
<starlight-plugin-show-latest-version>
<a href={sourceUrl} id="starlight-plugin-show-latest-version-link">
{!Astro.slots.has('fallback') && (
<Badge text="N/A" variant={pluginConfig.badge.variant} size={pluginConfig.badge.size} id='starlight-plugin-show-latest-version-badge'/>
)}
{Astro.slots.has('fallback') && (
<slot name='fallback' />
)}
</a>
</starlight-plugin-show-latest-version>
)}

<style>
#starlight-plugin-show-latest-version-link {
display: flex;
align-items: center;
text-decoration: none;
}
#starlight-plugin-show-latest-version-link {
display: flex;
align-items: center;
text-decoration: none;
}
</style>
4 changes: 2 additions & 2 deletions packages/starlight-plugin-show-latest-version/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,12 @@ export default function starlightPluginShowLatestVersion(
return {
name: "starlight-plugin-show-latest-version",
hooks: {
setup: async ({
"config:setup"({
addIntegration,
updateConfig: updateStarlightConfig,
config: starlightConfig,
logger,
}) => {
}) {
updateStarlightConfig({
components: {
...starlightConfig.components,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,67 +1,7 @@
---
import { Badge } from '@astrojs/starlight/components';
import { logos } from 'virtual:starlight/user-images';
import config from 'virtual:starlight/user-config';
import pluginConfig from 'virtual:starlight-plugin-show-latest-version-config';
import type { Props } from '../props';
import VersionBadge from '../components/VersionBadge.astro';
const { siteTitle, siteTitleHref } = Astro.props;
import Default from '@astrojs/starlight/components/SiteTitle.astro'
import DynamicVersionBadge from '../components/DynamicVersionBadge.astro'
---

<a href={siteTitleHref} class="site-title sl-flex">
{
config.logo && logos.dark && (
<>
<img
class:list={{ 'light:sl-hidden': !('src' in config.logo) }}
alt={config.logo.alt}
src={logos.dark.src}
width={logos.dark.width}
height={logos.dark.height}
/>
{/* Show light alternate if a user configure both light and dark logos. */}
{!('src' in config.logo) && (
<img
class="dark:sl-hidden"
alt={config.logo.alt}
src={logos.light?.src}
width={logos.light?.width}
height={logos.light?.height}
/>
)}
</>
)
}
<span class:list={{ 'sr-only': config.logo?.replacesTitle }} translate="no">
{siteTitle}
</span>
{pluginConfig.showInSiteTitle === "true" && (
<VersionBadge />
)}
{pluginConfig.showInSiteTitle === "deferred" && (
<VersionBadge server:defer>
<Badge text={"      "} variant={pluginConfig.badge.variant} size={pluginConfig.badge.size} slot="fallback" />
</VersionBadge>
)}
</a>


<style>
.site-title {
align-items: center;
gap: var(--sl-nav-gap);
font-size: var(--sl-text-h4);
font-weight: 600;
color: var(--sl-color-text-accent);
text-decoration: none;
white-space: nowrap;
}
img {
height: calc(var(--sl-nav-height) - 2 * var(--sl-nav-pad-y));
width: auto;
max-width: 100%;
object-fit: contain;
object-position: 0 50%;
}
</style>
<Default><slot /></Default>
<DynamicVersionBadge />
7 changes: 4 additions & 3 deletions packages/starlight-plugin-show-latest-version/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@
"type": "module",
"exports": {
".": "./index.ts",
"./components/DynamicVersionBadge.astro": "./components/DynamicVersionBadge.astro",
"./components/Version.astro": "./components/Version.astro",
"./components/VersionBadge.astro": "./components/VersionBadge.astro",
"./overrides/SiteTitle.astro": "./overrides/SiteTitle.astro",
Expand All @@ -29,15 +30,15 @@
"test": "jest"
},
"devDependencies": {
"@astrojs/starlight": "^0.30.3",
"@astrojs/starlight": "^0.32.0",
"@jest/globals": "^29.7.0",
"@types/jest": "^29.5.14",
"astro": "^5.1.1",
"astro": "^5.3.0",
"jest": "^29.7.0",
"ts-jest": "^29.2.5"
},
"peerDependencies": {
"@astrojs/starlight": ">=0.30"
"@astrojs/starlight": ">=0.32"
},
"engines": {
"node": "^18.17.1 || ^20.3.0 || >=21.0.0"
Expand Down
Loading

0 comments on commit 3656c8f

Please sign in to comment.