@astrojs/starlight 0.10.3 → 0.11.0

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,78 @@
 # @astrojs/starlight
 
+## 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
+
+- [#752](https://github.com/withastro/starlight/pull/752) [`6833ee1`](https://github.com/withastro/starlight/commit/6833ee12159ea5be23885c41da80569a89aafa33) Thanks [@apinet](https://github.com/apinet)! - Add X social link logo
+
+- [#789](https://github.com/withastro/starlight/pull/789) [`2528fb0`](https://github.com/withastro/starlight/commit/2528fb011a388f3920af9994012bd7db2b1654c3) Thanks [@delucis](https://github.com/delucis)! - Update bundled version of `@astrojs/mdx` to v1.1.0
+
+- [#794](https://github.com/withastro/starlight/pull/794) [`a0de12d`](https://github.com/withastro/starlight/commit/a0de12d596ab2b1c0d79d6d63d2d6cb9fe6d2644) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Add Telegram icon
+
+- [#792](https://github.com/withastro/starlight/pull/792) [`a8358df`](https://github.com/withastro/starlight/commit/a8358df7849b342de342a4a2e88e019c39d5bbe8) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Add RSS icon
+
+- [#778](https://github.com/withastro/starlight/pull/778) [`957d2c3`](https://github.com/withastro/starlight/commit/957d2c32123ab0c223fcef03f91ce3ad7be7aa21) Thanks [@jermanuts](https://github.com/jermanuts)! - Improve Arabic UI translations
+
 ## 0.10.3
 
 ### 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>
 		{

package/components/Icons.ts

@@ -68,6 +68,8 @@ export const Icons = {
 		'<path d="M6.11 15.12H3.75V0h2.36v15.12zm4.71-11.55H8.46V24h2.36V3.57zm4.72 0h-2.36V24h2.36V3.57zm4.71 0h-2.36v11.57h2.36V3.56z"/>',
 	twitter:
 		'<path d="M24 4.4a10 10 0 0 1-2.83.78 5.05 5.05 0 0 0 2.17-2.79 9.7 9.7 0 0 1-3.13 1.23 4.89 4.89 0 0 0-5.94-1.03 5 5 0 0 0-2.17 2.38 5.15 5.15 0 0 0-.3 3.25c-1.95-.1-3.86-.63-5.61-1.53a14.04 14.04 0 0 1-4.52-3.74 5.2 5.2 0 0 0-.09 4.91c.39.74.94 1.35 1.61 1.82a4.77 4.77 0 0 1-2.23-.63v.06c0 1.16.4 2.29 1.12 3.18a4.9 4.9 0 0 0 2.84 1.74c-.73.22-1.5.26-2.24.12a4.89 4.89 0 0 0 4.59 3.49A9.78 9.78 0 0 1 0 19.73 13.65 13.65 0 0 0 7.55 22a13.63 13.63 0 0 0 9.96-4.16A14.26 14.26 0 0 0 21.6 7.65V7c.94-.72 1.75-1.6 2.4-2.6Z"/>',
+	'x.com':
+		'<path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/>',
 	mastodon:
 		'<path d="M16.45 17.77c2.77-.33 5.18-2.03 5.49-3.58.47-2.45.44-5.97.44-5.97 0-4.77-3.15-6.17-3.15-6.17-1.58-.72-4.3-1.03-7.13-1.05h-.07c-2.83.02-5.55.33-7.13 1.05 0 0-3.14 1.4-3.14 6.17v.91c-.01.88-.02 1.86 0 2.88.12 4.67.87 9.27 5.2 10.4 2 .53 3.72.64 5.1.57 2.51-.14 3.92-.9 3.92-.9l-.08-1.8s-1.8.56-3.8.5c-2-.08-4.1-.22-4.43-2.66a4.97 4.97 0 0 1-.04-.68s1.96.48 4.44.59c1.51.07 2.94-.09 4.38-.26Zm2.22-3.4h-2.3v-5.6c0-1.19-.5-1.79-1.5-1.79-1.1 0-1.66.71-1.66 2.12v3.07h-2.3V9.1c0-1.4-.55-2.12-1.65-2.12-1 0-1.5.6-1.5 1.78v5.61h-2.3V8.6c0-1.18.3-2.12.9-2.81a3.17 3.17 0 0 1 2.47-1.05c1.18 0 2.07.45 2.66 1.35l.57.96.58-.96a2.97 2.97 0 0 1 2.66-1.35c1.01 0 1.83.36 2.46 1.05.6.7.9 1.63.9 2.81v5.78Z"/>',
 	codeberg:
@@ -86,4 +88,11 @@ export const Icons = {
 		'<path d="M17.3 5.5a1.2 1.2 0 1 0 1.2 1.2 1.2 1.2 0 0 0-1.2-1.2ZM22 7.9a7.6 7.6 0 0 0-.4-2.5 5 5 0 0 0-1.2-1.7 4.7 4.7 0 0 0-1.8-1.2 7.3 7.3 0 0 0-2.4-.4L12 2H7.9a7.3 7.3 0 0 0-2.5.5 4.8 4.8 0 0 0-1.7 1.2 4.7 4.7 0 0 0-1.2 1.8 7.3 7.3 0 0 0-.4 2.4L2 12v4.1a7.3 7.3 0 0 0 .5 2.4 4.7 4.7 0 0 0 1.2 1.8 4.8 4.8 0 0 0 1.8 1.2 7.3 7.3 0 0 0 2.4.4l4.1.1h4.1a7.3 7.3 0 0 0 2.4-.5 4.7 4.7 0 0 0 1.8-1.2 4.8 4.8 0 0 0 1.2-1.7 7.6 7.6 0 0 0 .4-2.5L22 12V7.9ZM20.1 16a5.6 5.6 0 0 1-.3 1.9A3 3 0 0 1 19 19a3.2 3.2 0 0 1-1.1.8 5.6 5.6 0 0 1-1.9.3H8a5.7 5.7 0 0 1-1.9-.3A3.3 3.3 0 0 1 5 19a3 3 0 0 1-.7-1.1 5.5 5.5 0 0 1-.4-1.9l-.1-4V8a5.5 5.5 0 0 1 .4-1.9A3 3 0 0 1 5 5a3.1 3.1 0 0 1 1.1-.8A5.7 5.7 0 0 1 8 3.9l4-.1h4a5.6 5.6 0 0 1 1.9.4A3 3 0 0 1 19 5a3 3 0 0 1 .7 1.1A5.6 5.6 0 0 1 20 8l.1 4v4ZM12 6.9a5.1 5.1 0 1 0 5.1 5.1A5.1 5.1 0 0 0 12 6.9Zm0 8.4a3.3 3.3 0 1 1 3.3-3.3 3.3 3.3 0 0 1-3.3 3.3Z"/>',
 	stackOverflow:
 		'<path d="M15.72 0 14 1.28l6.4 8.58 1.7-1.26L15.73 0zm-3.94 3.42-1.36 1.64 8.22 6.85 1.37-1.64-8.23-6.85zM8.64 7.88l-.91 1.94 9.7 4.52.9-1.94-9.7-4.52zm-1.86 4.86-.44 2.1 10.48 2.2.44-2.1-10.47-2.2zM1.9 15.47V24h19.19v-8.53h-2.13v6.4H4.02v-6.4H1.9zm4.26 2.13v2.13h10.66V17.6H6.15Z"/>',
+	telegram:
+		'<path d="M22.26465,2.42773a2.04837,2.04837,0,0,0-2.07813-.32421L2.26562,9.33887a2.043,2.043,0,0,0,.1045,3.81836l3.625,1.26074,2.0205,6.68164A.998.998,0,0,0,8.134,21.352c.00775.012.01868.02093.02692.03259a.98844.98844,0,0,0,.21143.21576c.02307.01758.04516.03406.06982.04968a.98592.98592,0,0,0,.31073.13611l.01184.001.00671.00287a1.02183,1.02183,0,0,0,.20215.02051c.00653,0,.01233-.00312.0188-.00324a.99255.99255,0,0,0,.30109-.05231c.02258-.00769.04193-.02056.06384-.02984a.9931.9931,0,0,0,.20429-.11456,250.75993,250.75993,0,0,1,.15222-.12818L12.416,18.499l4.03027,3.12207a2.02322,2.02322,0,0,0,1.24121.42676A2.05413,2.05413,0,0,0,19.69531,20.415L22.958,4.39844A2.02966,2.02966,0,0,0,22.26465,2.42773ZM9.37012,14.73633a.99357.99357,0,0,0-.27246.50586l-.30951,1.504-.78406-2.59307,4.06525-2.11695ZM17.67188,20.04l-4.7627-3.68945a1.00134,1.00134,0,0,0-1.35352.11914l-.86541.9552.30584-1.48645,7.083-7.083a.99975.99975,0,0,0-1.16894-1.59375L6.74487,12.55432,3.02051,11.19141,20.999,3.999Z"/>',
+	rss: '<path d="M2.88,16.88a3,3,0,0,0,0,4.24,3,3,0,0,0,4.24,0,3,3,0,0,0-4.24-4.24Zm2.83,2.83a1,1,0,0,1-1.42-1.42,1,1,0,0,1,1.42,0A1,1,0,0,1,5.71,19.71ZM5,12a1,1,0,0,0,0,2,5,5,0,0,1,5,5,1,1,0,0,0,2,0,7,7,0,0,0-7-7ZM5,8a1,1,0,0,0,0,2,9,9,0,0,1,9,9,1,1,0,0,0,2,0,11.08,11.08,0,0,0-3.22-7.78A11.08,11.08,0,0,0,5,8Zm10.61.39A15.11,15.11,0,0,0,5,4,1,1,0,0,0,5,6,13,13,0,0,1,18,19a1,1,0,0,0,2,0A15.11,15.11,0,0,0,15.61,8.39Z"/>',
+	facebook:
+		'<path d="M20.9,2H3.1A1.1,1.1,0,0,0,2,3.1V20.9A1.1,1.1,0,0,0,3.1,22h9.58V14.25h-2.6v-3h2.6V9a3.64,3.64,0,0,1,3.88-4,20.26,20.26,0,0,1,2.33.12v2.7H17.3c-1.26,0-1.5.6-1.5,1.47v1.93h3l-.39,3H15.8V22h5.1A1.1,1.1,0,0,0,22,20.9V3.1A1.1,1.1,0,0,0,20.9,2Z"/>',
+	email:
+		'<path d="M19,4H5A3,3,0,0,0,2,7V17a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V7A3,3,0,0,0,19,4Zm-.41,2-5.88,5.88a1,1,0,0,1-1.42,0L5.41,6ZM20,17a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V7.41l5.88,5.88a3,3,0,0,0,4.24,0L20,7.41Z"/>',
 };

package/components/LanguageSelect.astro

@@ -3,10 +3,7 @@ import config from 'virtual:starlight/user-config';
 import { localizedUrl } from '../utils/localizedUrl';
 import { useTranslations } from '../utils/translations';
 import Select from './Select.astro';
-
-interface Props {
-	locale: string | undefined;
-}
+import type { Props } from '../props';
 
 /**
  * Get the equivalent of the current page path for the passed locale.

package/components/LastUpdated.astro

@@ -1,36 +1,17 @@
 ---
-import type { CollectionEntry } from 'astro:content';
-import { fileURLToPath } from 'node:url';
-import project from 'virtual:starlight/project-context';
-import { getFileCommitDate } from '../utils/git';
+import type { Props } from '../props';
 import { useTranslations } from '../utils/translations';
 
-interface Props {
-	id: CollectionEntry<'docs'>['id'];
-	lang: string;
-	lastUpdated: Date | undefined;
-	locale: string | undefined;
-}
-
-const { id, lang, lastUpdated, locale } = Astro.props;
+const { lang, lastUpdated, locale } = Astro.props;
 const t = useTranslations(locale);
-
-const currentFilePath = fileURLToPath(new URL('src/content/docs/' + id, project.root));
-
-let date = lastUpdated;
-try {
-	if (!date) {
-		({ date } = getFileCommitDate(currentFilePath, 'newest'));
-	}
-} catch {}
 ---
 
 {
-	date && (
+	lastUpdated && (
 		<p>
 			{t('page.lastUpdated')}{' '}
-			<time datetime={date.toISOString()}>
-				{date.toLocaleDateString(lang, { dateStyle: 'medium' })}
+			<time datetime={lastUpdated.toISOString()}>
+				{lastUpdated.toLocaleDateString(lang, { dateStyle: 'medium' })}
 			</time>
 		</p>
 	)

package/components/MarkdownContent.astro

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

package/components/MobileMenuFooter.astro

@@ -0,0 +1,17 @@
+---
+import { LanguageSelect, ThemeSelect } from 'virtual:starlight/components';
+import type { Props } from '../props';
+---
+
+<div class="mobile-preferences sl-flex">
+	<ThemeSelect {...Astro.props} />
+	<LanguageSelect {...Astro.props} />
+</div>
+
+<style>
+	.mobile-preferences {
+		justify-content: space-between;
+		border-top: 1px solid var(--sl-color-gray-6);
+		padding: 0.5rem 0;
+	}
+</style>

package/components/MobileMenuToggle.astro

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

package/components/{TableOfContents/MobileTableOfContents.astro → MobileTableOfContents.astro}

@@ -1,36 +1,33 @@
 ---
-import { useTranslations } from '../../utils/translations';
-import Icon from '../../user-components/Icon.astro';
-import TableOfContentsList from './TableOfContentsList.astro';
-import type { TocItem } from './generateToC';
+import { useTranslations } from '../utils/translations';
+import Icon from '../user-components/Icon.astro';
+import TableOfContentsList from './TableOfContents/TableOfContentsList.astro';
+import type { Props } from '../props';
 
-interface Props {
-	toc: TocItem[];
-	locale: string | undefined;
-	maxHeadingLevel: number;
-	minHeadingLevel: number;
-}
-
-const { locale, toc, maxHeadingLevel, minHeadingLevel } = Astro.props;
+const { locale, toc } = Astro.props;
 const t = useTranslations(locale);
 ---
 
-<mobile-starlight-toc data-min-h={minHeadingLevel} data-max-h={maxHeadingLevel}>
-	<nav aria-labelledby="starlight__on-this-page--mobile" class="lg:sl-hidden">
-		<details id="starlight__mobile-toc">
-			<summary id="starlight__on-this-page--mobile" class="sl-flex">
-				<div class="toggle sl-flex">
-					{t('tableOfContents.onThisPage')}
-					<Icon name={'right-caret'} class="caret" size="1rem" />
-				</div>
-				<span class="display-current">{toc[0]?.text}</span>
-			</summary>
-			<div class="dropdown">
-				<TableOfContentsList toc={toc} isMobile />
-			</div>
-		</details>
-	</nav>
-</mobile-starlight-toc>
+{
+	toc && (
+		<mobile-starlight-toc data-min-h={toc.minHeadingLevel} data-max-h={toc.maxHeadingLevel}>
+			<nav aria-labelledby="starlight__on-this-page--mobile">
+				<details id="starlight__mobile-toc">
+					<summary id="starlight__on-this-page--mobile" class="sl-flex">
+						<div class="toggle sl-flex">
+							{t('tableOfContents.onThisPage')}
+							<Icon name={'right-caret'} class="caret" size="1rem" />
+						</div>
+						<span class="display-current" />
+					</summary>
+					<div class="dropdown">
+						<TableOfContentsList toc={toc.items} isMobile />
+					</div>
+				</details>
+			</nav>
+		</mobile-starlight-toc>
+	)
+}
 
 <style>
 	nav {
@@ -112,7 +109,7 @@ const t = useTranslations(locale);
 </style>
 
 <script>
-	import { StarlightTOC } from './starlight-toc';
+	import { StarlightTOC } from './TableOfContents/starlight-toc';
 
 	class MobileStarlightTOC extends StarlightTOC {
 		override set current(link: HTMLAnchorElement) {