@astrojs/starlight 0.10.4 → 0.11.1

package/404.astro

@@ -2,7 +2,8 @@
 import { getEntry } from 'astro:content';
 import config from 'virtual:starlight/user-config';
 import EmptyContent from './components/EmptyMarkdown.md';
-import Page from './layout/Page.astro';
+import Page from './components/Page.astro';
+import { generateRouteData } from './utils/route-data';
 import type { StarlightDocsEntry } from './utils/routing';
 import { useTranslations } from './utils/translations';
 
@@ -24,6 +25,8 @@ const fallbackEntry: StarlightDocsEntry = {
 		editUrl: false,
 		head: [],
 		hero: { tagline: t('404.text'), actions: [] },
+		pagefind: false,
+		sidebar: { hidden: false },
 	},
 	render: async () => ({
 		Content: EmptyContent,
@@ -35,8 +38,10 @@ const fallbackEntry: StarlightDocsEntry = {
 const userEntry = await getEntry('docs', '404');
 const entry = userEntry || fallbackEntry;
 const { Content, headings } = await entry.render();
+const route = generateRouteData({
+	props: { ...entryMeta, entryMeta, headings, entry, id: entry.id, slug: entry.slug },
+	url: Astro.url,
+});
 ---
 
-<Page {headings} entry={entry} id={entry.id} slug={entry.slug} {...entryMeta} {entryMeta}>
-	<Content />
-</Page>
+<Page {...route}><Content /></Page>

package/CHANGELOG.md

@@ -1,5 +1,82 @@
 # @astrojs/starlight
 
+## 0.11.1
+
+### Patch Changes
+
+- [#892](https://github.com/withastro/starlight/pull/892) [`2b30321`](https://github.com/withastro/starlight/commit/2b30321bde801bb9945d73dc954e25b40f4324fa) Thanks [@delucis](https://github.com/delucis)! - Add Patreon social link icon
+
+- [#854](https://github.com/withastro/starlight/pull/854) [`71a52a1`](https://github.com/withastro/starlight/commit/71a52a16c44e3568128c83070541235133c44436) Thanks [@mehalter](https://github.com/mehalter)! - Add Reddit icon
+
+- [#852](https://github.com/withastro/starlight/pull/852) [`344c92e`](https://github.com/withastro/starlight/commit/344c92e1b8bca5f92ec087df6cccf5c611eefdff) Thanks [@Lootjs](https://github.com/Lootjs)! - Improve Russian language support
+
+- [#891](https://github.com/withastro/starlight/pull/891) [`395920c`](https://github.com/withastro/starlight/commit/395920c46e7b24cfff31800b3426ab375078e5c1) Thanks [@Frikadellios](https://github.com/Frikadellios)! - Add Ukrainian language support
+
+- [#890](https://github.com/withastro/starlight/pull/890) [`63ea8e8`](https://github.com/withastro/starlight/commit/63ea8e86643b050c6be6f9a6167f6642b039c709) Thanks [@delucis](https://github.com/delucis)! - Update `execa` dependency to v8
+
+- [#859](https://github.com/withastro/starlight/pull/859) [`eaa7a90`](https://github.com/withastro/starlight/commit/eaa7a902c7b7638b326709fd5203d932b20ed3fa) Thanks [@oggnimodd](https://github.com/oggnimodd)! - Improve Indonesian language support
+
+- [#864](https://github.com/withastro/starlight/pull/864) [`b84aff2`](https://github.com/withastro/starlight/commit/b84aff2b9cccbc35c8619763c7f36841abe6344b) Thanks [@mehalter](https://github.com/mehalter)! - Optimize UI icon SVG paths
+
+## 0.11.0
+
+### Minor Changes
+
+- [#774](https://github.com/withastro/starlight/pull/774) [`903a579`](https://github.com/withastro/starlight/commit/903a57942ceb99b68672c3fa54622b39cc5d76f8) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Support adding HTML attributes to sidebar links from config and frontmatter
+
+- [#796](https://github.com/withastro/starlight/pull/796) [`372ec96`](https://github.com/withastro/starlight/commit/372ec96d31d0c1a9aa8bc1605de2b424bf9bd5af) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Add the `@astrojs/sitemap` and `@astrojs/mdx` integrations only if they are not detected in the Astro configuration.
+
+  ⚠️ **BREAKING CHANGE** The minimum supported version of Astro is now v3.2.0. Make sure you update Astro at the same time as updating Starlight:
+
+  ```sh
+  npm install astro@latest
+  ```
+
+- [#447](https://github.com/withastro/starlight/pull/447) [`b45719b`](https://github.com/withastro/starlight/commit/b45719b581353f8d8f0ce0a9b5c89132e902377b) Thanks [@andremralves](https://github.com/andremralves)! - Add `titleDelimiter` configuration option and include site title in page `<title>` tags
+
+  ⚠️ **BREAKING CHANGE** — Previously, every page’s `<title>` only included its individual frontmatter title.
+  Now, `<title>` tags include the page title, a delimiter character (`|` by default), and the site title.
+  For example, in the Startlight docs, `<title>Configuration Reference</title>` is now `<title>Configuration Reference | Starlight</title>`.
+
+  If you have a page where you need to override this new behaviour, set a custom title using the `head` frontmatter property:
+
+  ```md
+  ---
+  title: My Page
+  head:
+    - tag: title
+      content: Custom Title
+  ---
+  ```
+
+- [#709](https://github.com/withastro/starlight/pull/709) [`140e729`](https://github.com/withastro/starlight/commit/140e729a8bf12f805ae0b7e2b5ad959cf68d8e22) Thanks [@delucis](https://github.com/delucis)! - Add support for overriding Starlight’s built-in components
+
+  ⚠️ **BREAKING CHANGE** — The page footer is now included on pages with `template: splash` in their frontmatter. Previously, this was not the case. If you are using `template: splash` and want to continue to hide footer elements, disable them in your frontmatter:
+
+  ```md
+  ---
+  title: Landing page
+  template: splash
+  # Disable unwanted footer elements as needed
+  editUrl: false
+  lastUpdated: false
+  prev: false
+  next: false
+  ---
+  ```
+
+  ⚠️ **BREAKING CHANGE** — This change involved refactoring the structure of some of Starlight’s built-in components slightly. If you were previously overriding these using other techniques, you may need to adjust your code.
+
+### Patch Changes
+
+- [#815](https://github.com/withastro/starlight/pull/815) [`b7b23a2`](https://github.com/withastro/starlight/commit/b7b23a2c90a25fe8ea08338379b83d19c74d9037) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Add Facebook and email icons
+
+- [#810](https://github.com/withastro/starlight/pull/810) [`dbe977b`](https://github.com/withastro/starlight/commit/dbe977b6ce3efcffefab850eca08bef316b41e53) Thanks [@hasham-qaiser](https://github.com/hasham-qaiser)! - Use `<span>` instead of `<h2>` in sidebar group headings
+
+- [#807](https://github.com/withastro/starlight/pull/807) [`7c73dd1`](https://github.com/withastro/starlight/commit/7c73dd146ee294f9092346a0b0041990cc648a13) Thanks [@torn4dom4n](https://github.com/torn4dom4n)! - Add Vietnamese translations for Starlight UI
+
+- [#756](https://github.com/withastro/starlight/pull/756) [`f55a8f0`](https://github.com/withastro/starlight/commit/f55a8f014a7addc46e971dd6b7148f4545acd16c) Thanks [@julien-deramond](https://github.com/julien-deramond)! - Prevent text from overflowing in several cases
+
 ## 0.10.4
 
 ### Patch Changes

package/components/Badge.astro

@@ -22,6 +22,7 @@ const { variant = 'default', text } = Astro.props;
 		line-height: 1;
 		color: #fff;
 		background-color: var(--sl-color-bg-badge);
+		overflow-wrap: anywhere;
 	}
 
 	.outline {

package/components/Banner.astro

@@ -1,10 +1,10 @@
 ---
-interface Props {
-	content: string;
-}
+import type { Props } from '../props';
+
+const { banner } = Astro.props.entry.data;
 ---
 
-<div class="sl-banner" set:html={Astro.props.content} />
+{banner && <div class="sl-banner" set:html={banner.content} />}
 
 <style>
 	.sl-banner {

package/components/ContentPanel.astro

@@ -1,3 +1,7 @@
+---
+import type { Props } from '../props';
+---
+
 <div class="content-panel">
 	<div class="sl-container"><slot /></div>
 </div>

package/components/EditLink.astro

@@ -1,34 +1,15 @@
 ---
-import type { CollectionEntry } from 'astro:content';
-import config from 'virtual:starlight/user-config';
-import project from 'virtual:starlight/project-context';
-import { useTranslations } from '../utils/translations';
 import Icon from '../user-components/Icon.astro';
-
-interface Props {
-	data: CollectionEntry<'docs'>['data'];
-	id: CollectionEntry<'docs'>['id'];
-	locale: string | undefined;
-}
+import type { Props } from '../props';
+import { useTranslations } from '../utils/translations';
 
 const t = useTranslations(Astro.props.locale);
-const { editUrl } = Astro.props.data;
-const srcPath = project.srcDir.replace(project.root, '');
-
-let { baseUrl } = config.editLink;
-if (baseUrl && baseUrl.at(-1) !== '/') baseUrl += '/';
-
-const url =
-	typeof editUrl === 'string'
-		? editUrl
-		: baseUrl
-		? baseUrl + srcPath + 'content/docs/' + Astro.props.id
-		: undefined;
+const { editUrl } = Astro.props;
 ---
 
 {
-	editUrl !== false && url && (
-		<a href={url} class="sl-flex">
+	editUrl && (
+		<a href={editUrl} class="sl-flex">
 			<Icon name="pencil" size="1.2em" />
 			{t('page.editLink')}
 		</a>

package/components/FallbackContentNotice.astro

@@ -1,10 +1,7 @@
 ---
-import { useTranslations } from '../utils/translations';
 import Icon from '../user-components/Icon.astro';
-
-interface Props {
-	locale: string | undefined;
-}
+import type { Props } from '../props';
+import { useTranslations } from '../utils/translations';
 
 const t = useTranslations(Astro.props.locale);
 ---

package/components/Footer.astro

@@ -1,42 +1,15 @@
 ---
-import config from 'virtual:starlight/user-config';
-import { type SidebarEntry, getPrevNextLinks } from '../utils/navigation';
-import type { StarlightDocsEntry } from '../utils/routing';
-import type { LocaleData } from '../utils/slugs';
+import type { Props } from '../props';
 
-import LastUpdated from '../components/LastUpdated.astro';
-import PrevNextLinks from '../components/PrevNextLinks.astro';
-import EditLink from './EditLink.astro';
-
-interface Props extends LocaleData {
-	entry: StarlightDocsEntry;
-	sidebar: SidebarEntry[];
-}
-
-const { entry, dir, lang, locale, sidebar } = Astro.props;
-const prevNextLinks = getPrevNextLinks(sidebar, config.pagination, {
-	prev: entry.data.prev,
-	next: entry.data.next,
-});
+import { EditLink, LastUpdated, Pagination } from 'virtual:starlight/components';
 ---
 
 <footer>
 	<div class="meta sl-flex">
-		{config.editLink.baseUrl && <EditLink data={entry.data} id={entry.id} {locale} />}
-		{
-			(entry.data.lastUpdated ?? config.lastUpdated) && (
-				<LastUpdated
-					id={entry.id}
-					{lang}
-					lastUpdated={
-						typeof entry.data.lastUpdated !== 'boolean' ? entry.data.lastUpdated : undefined
-					}
-					{locale}
-				/>
-			)
-		}
+		<EditLink {...Astro.props} />
+		<LastUpdated {...Astro.props} />
 	</div>
-	<PrevNextLinks {...prevNextLinks} {dir} {locale} />
+	<Pagination {...Astro.props} />
 </footer>
 
 <style>

package/components/{HeadSEO.astro → Head.astro}

@@ -1,21 +1,17 @@
 ---
-import type { CollectionEntry, z } from 'astro:content';
+import type { z } from 'astro/zod';
 import config from 'virtual:starlight/user-config';
+import { version } from '../package.json';
 import type { HeadConfigSchema } from '../schemas/head';
+import { fileWithBase } from '../utils/base';
 import { createHead } from '../utils/head';
 import { localizedUrl } from '../utils/localizedUrl';
-import { fileWithBase } from '../utils/base';
-import { version } from '../package.json';
-
-interface Props {
-	data: CollectionEntry<'docs'>['data'];
-	lang: string;
-}
+import type { Props } from '../props';
 
-const { data, lang } = Astro.props;
+const { entry, lang } = Astro.props;
+const { data } = entry;
 
 const canonical = Astro.site ? new URL(Astro.url.pathname, Astro.site) : undefined;
-const title = data.title || config.title;
 const description = data.description || config.description;
 
 const headDefaults: z.input<ReturnType<typeof HeadConfigSchema>> = [
@@ -24,7 +20,7 @@ const headDefaults: z.input<ReturnType<typeof HeadConfigSchema>> = [
 		tag: 'meta',
 		attrs: { name: 'viewport', content: 'width=device-width, initial-scale=1' },
 	},
-	{ tag: 'title', content: title },
+	{ tag: 'title', content: `${data.title} ${config.titleDelimiter} ${config.title}` },
 	{ tag: 'link', attrs: { rel: 'canonical', href: canonical?.href } },
 	{ tag: 'meta', attrs: { name: 'generator', content: Astro.generator } },
 	{
@@ -41,7 +37,7 @@ const headDefaults: z.input<ReturnType<typeof HeadConfigSchema>> = [
 		},
 	},
 	// OpenGraph Tags
-	{ tag: 'meta', attrs: { property: 'og:title', content: title } },
+	{ tag: 'meta', attrs: { property: 'og:title', content: data.title } },
 	{ tag: 'meta', attrs: { property: 'og:type', content: 'article' } },
 	{ tag: 'meta', attrs: { property: 'og:url', content: canonical?.href } },
 	{ tag: 'meta', attrs: { property: 'og:locale', content: lang } },
@@ -52,7 +48,7 @@ const headDefaults: z.input<ReturnType<typeof HeadConfigSchema>> = [
 		tag: 'meta',
 		attrs: { name: 'twitter:card', content: 'summary_large_image' },
 	},
-	{ tag: 'meta', attrs: { name: 'twitter:title', content: title } },
+	{ tag: 'meta', attrs: { name: 'twitter:title', content: data.title } },
 	{ tag: 'meta', attrs: { name: 'twitter:description', content: description } },
 ];
 
@@ -95,7 +91,7 @@ if (config.social?.twitter) {
 		tag: 'meta',
 		attrs: {
 			name: 'twitter:site',
-			content: new URL(config.social.twitter).pathname,
+			content: new URL(config.social.twitter.url).pathname,
 		},
 	});
 }

package/components/Header.astro

@@ -1,24 +1,28 @@
 ---
-import LanguageSelect from './LanguageSelect.astro';
-import Search from './Search.astro';
-import SiteTitle from './SiteTitle.astro';
-import SocialIcons from './SocialIcons.astro';
-import ThemeSelect from './ThemeSelect.astro';
+import type { Props } from '../props';
 
-interface Props {
-	locale: string | undefined;
-}
-
-const { locale } = Astro.props;
+import {
+	LanguageSelect,
+	Search,
+	SiteTitle,
+	SocialIcons,
+	ThemeSelect,
+} from 'virtual:starlight/components';
 ---
 
 <div class="header sl-flex">
-	<SiteTitle {locale} />
-	<Search {locale} />
+	<div class="sl-flex">
+		<SiteTitle {...Astro.props} />
+	</div>
+	<div class="sl-flex">
+		<Search {...Astro.props} />
+	</div>
 	<div class="sl-hidden md:sl-flex right-group">
-		<SocialIcons />
-		<ThemeSelect {locale} />
-		<LanguageSelect {locale} />
+		<div class="sl-flex social-icons">
+			<SocialIcons {...Astro.props} />
+		</div>
+		<ThemeSelect {...Astro.props} />
+		<LanguageSelect {...Astro.props} />
 	</div>
 </div>
 
@@ -30,10 +34,16 @@ const { locale } = Astro.props;
 		height: 100%;
 	}
 
-	.right-group {
+	.right-group,
+	.social-icons {
 		gap: 1rem;
 		align-items: center;
 	}
+	.social-icons::after {
+		content: '';
+		height: 2rem;
+		border-inline-end: 1px solid var(--sl-color-gray-5);
+	}
 
 	@media (min-width: 50rem) {
 		:global(:root[data-has-sidebar]) {

package/components/Hero.astro

@@ -1,21 +1,18 @@
 ---
-import type { CollectionEntry } from 'astro:content';
 import { Image } from 'astro:assets';
+import { PAGE_TITLE_ID } from '../constants';
+import type { Props } from '../props';
 import CallToAction from './CallToAction.astro';
 
-interface Props {
-	fallbackTitle: string;
-	hero: NonNullable<CollectionEntry<'docs'>['data']['hero']>;
-}
-
-const { title = Astro.props.fallbackTitle, tagline, image, actions } = Astro.props.hero;
+const { data } = Astro.props.entry;
+const { title = data.title, tagline, image, actions = [] } = data.hero || {};
 
 const imageAttrs = {
 	loading: 'eager' as const,
 	decoding: 'async' as const,
 	width: 400,
 	height: 400,
-	alt: image?.alt,
+	alt: image?.alt || '',
 };
 ---
 
@@ -33,7 +30,7 @@ const imageAttrs = {
 	}
 	<div class="sl-flex stack">
 		<div class="sl-flex copy">
-			<h1 id="_top" data-page-title set:html={title} />
+			<h1 id={PAGE_TITLE_ID} data-page-title set:html={title} />
 			{tagline && <div class="tagline" set:html={tagline} />}
 		</div>
 		{