Skip to content

v0.7.0

Choose a tag to compare

@github-actions github-actions released this 18 Jul 06:43
a7dac8d

Breaking Changes

Peer Dependencies

  • @astrojs/starlight: >=0.37>=0.41 — projects on Starlight 0.37–0.40 must upgrade
  • astro: v6 → v7 — Astro v6 is no longer supported
  • @pagefind/default-ui removed from dependencies
  • 18 @fontsource/geist-* packages removed (fonts now loaded via Astro Font API)
  • marked removed — no longer needed since footerText config option was removed

Removed Components

If you were overriding or importing any of these, you must migrate:

Removed Replacement
Callout Use Starlight's built-in :::note / :::tip / :::caution / :::danger markdown syntax — styled in CSS
ContainerSection Removed — layout handled via CSS
LinkedCard Use Starlight's built-in <LinkCard> — styled in CSS
LinkedCardGroup Use Starlight's built-in <CardGrid> — styled in CSS
Steps Use Starlight's built-in <Steps> — styled in CSS
Drawer Replaced by MobileNav + MobileNavTrigger

Removed Overrides (10 fewer templates to maintain)

These Starlight components are no longer overridden. All styling is done via CSS selectors in base.css:

PageFrame, Header, TwoColumnContent, ContentPanel, MarkdownContent, Footer, SocialIcons, Search, TableOfContents, PageSidebar

Removed Translations

The plugin no longer ships its own translation strings. The translations/ directory and the i18n:setup hook have been removed.


Migration Guide

1. Update dependencies

{
  "peerDependencies": {
    "astro": "^7.0.0",
    "@astrojs/starlight": ">=0.41"
  }
}

2. Remove deleted component imports

- import { Callout, LinkedCard, LinkedCardGroup, Steps } from 'starlight-theme-black/user-components'
+ import { LinkButton } from 'starlight-theme-black/user-components'

Replace in your MDX files:

Callout → Asides (markdown syntax):

- <Callout title="Note">Some content</Callout>
+ :::note
+ Some content
+ :::

- <Callout title="Warning">Be careful</Callout>
+ :::caution
+ Be careful
+ :::

LinkedCard → LinkCard:

- <LinkedCard title="Getting Started" href="/getting-started" />
+ <LinkCard title="Getting Started" href="/getting-started" />

LinkedCardGroup → CardGrid:

- <LinkedCardGroup>
-   <LinkedCard title="..." href="..." />
-   <LinkedCard title="..." href="..." />
- </LinkedCardGroup>
+ <CardGrid>
+   <LinkCard title="..." href="..." />
+   <LinkCard title="..." href="..." />
+ </CardGrid>

Steps (no change needed):

- import { Steps } from 'starlight-theme-black/user-components'
+ import { Steps } from '@astrojs/starlight/components'

3. Update custom CSS selectors

If you were overriding the same Starlight components, remove those overrides — the theme now handles them via CSS. If you had custom CSS targeting these selectors, check for conflicts:

  • .layout, .layout__grid, .layout__header → replaced by Starlight's default header/layout selectors
  • .container-wrapper-main, .aside → removed (layout uses Starlight's grid)
  • .footer, .footer-container, .footer-text → replaced by footer > .meta

4. Font loading

Fonts are now loaded via Astro's <Font> component in Head.astro override. Remove any manual @fontsource imports from your customCss:

  customCss: [
-   '@fontsource/geist-sans/400.css',
-   '@fontsource/geist-mono/400.css',
    // ... other styles
  ]

5. Config schema changes

NavLinks — new schema aligned with Starlight's sidebar structure. Supports external links, internal slugs, i18n badges, and translations:

navLinks: [
  // External link with full config
  { label: 'Home', link: '/' },

  // Internal slug shorthand (label inferred from frontmatter)
  'getting-started',

  // External link with badge and HTML attributes
  {
    label: 'Starlight',
    link: 'https://starlight.astro.build',
    badge: 'External',
    attrs: { target: '_blank', rel: 'noopener' }
  },

  // With i18n badge
  {
    label: 'Docs',
    link: '/docs',
    badge: { en: 'New', es: 'Nuevo' }
  },

  // With label translations
  {
    label: { en: 'Blog', es: 'Blog' },
    link: '/blog'
  }
]

Hero layout — new options:

hero: {
  layout: 'centered' | 'media-top' | 'media-left' | 'media-right' | 'banner'
  announcement?: { text: string; link: string }
}

Footer textfooterText config option removed. The footer now uses Starlight's default rendering.

6. Remove footerText from config

  starlightThemeBlack({
-   footerText: 'Built by [Author](https://example.com)',
    // ... other config
  })

   🚨 Breaking Changes

   🚀 Features

    View changes on GitHub