@astrojs/starlight 0.12.0 → 0.12.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @astrojs/starlight
 
+## 0.12.1
+
+### Patch Changes
+
+- [#1069](https://github.com/withastro/starlight/pull/1069) [`b86f360`](https://github.com/withastro/starlight/commit/b86f3608f03be9455ec1d5ba11820c9bf601ad1e) Thanks [@Genteure](https://github.com/Genteure)! - Fix sidebar highlighting and navigation buttons for pages with path containing non-ASCII characters
+
+- [#1025](https://github.com/withastro/starlight/pull/1025) [`0d1e75e`](https://github.com/withastro/starlight/commit/0d1e75e17269ddac3eb15b7dfb4480da1bb01c6c) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Internal: fix import issue in translation string loading mechanism
+
+- [#1044](https://github.com/withastro/starlight/pull/1044) [`a5a9754`](https://github.com/withastro/starlight/commit/a5a9754f111b97abfd277d99759e9857aa0fb22b) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Fix last updated dates for pages displaying fallback content
+
+- [#1049](https://github.com/withastro/starlight/pull/1049) [`c27495d`](https://github.com/withastro/starlight/commit/c27495da61f9376236519ed3f08a169f245a189c) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Expose Markdown content styles in `@astrojs/starlight/style/markdown.css`
+
 ## 0.12.0
 
 ### Minor Changes

package/components/MarkdownContent.astro

@@ -1,127 +1,6 @@
 ---
 import type { Props } from '../props';
+import '../style/markdown.css';
 ---
 
-<div class="content"><slot /></div>
-
-<style>
-	.content
-		:global(
-			:not(a, strong, em, del, span, input, code)
-				+ :not(a, strong, em, del, span, input, code, :where(.not-content *))
-		) {
-		margin-top: 1.5rem;
-	}
-
-	/* Headings after non-headings have more spacing. */
-	.content
-		:global(
-			:not(h1, h2, h3, h4, h5, h6) + :is(h1, h2, h3, h4, h5, h6):not(:where(.not-content *))
-		) {
-		margin-top: 2.5rem;
-	}
-
-	.content :global(li + li:not(:where(.not-content *))),
-	.content :global(dt + dt:not(:where(.not-content *))),
-	.content :global(dt + dd:not(:where(.not-content *))),
-	.content :global(dd + dd:not(:where(.not-content *))) {
-		margin-top: 0.25rem;
-	}
-
-	.content
-		:global(
-			li > :last-child:not(li, ul, ol):not(a, strong, em, del, span, input, :where(.not-content *))
-		) {
-		margin-bottom: 1.25rem;
-	}
-
-	.content :global(dt:not(:where(.not-content *))) {
-		font-weight: 700;
-	}
-	.content :global(dd:not(:where(.not-content *))) {
-		padding-inline-start: 1rem;
-	}
-
-	.content :global(:is(h1, h2, h3, h4, h5, h6):not(:where(.not-content *))) {
-		color: var(--sl-color-white);
-		line-height: var(--sl-line-height-headings);
-		font-weight: 600;
-	}
-
-	.content :global(:is(img, picture, video, canvas, svg, iframe):not(:where(.not-content *))) {
-		display: block;
-		max-width: 100%;
-		height: auto;
-	}
-
-	.content :global(h1:not(:where(.not-content *))) {
-		font-size: var(--sl-text-h1);
-	}
-	.content :global(h2:not(:where(.not-content *))) {
-		font-size: var(--sl-text-h2);
-	}
-	.content :global(h3:not(:where(.not-content *))) {
-		font-size: var(--sl-text-h3);
-	}
-	.content :global(h4:not(:where(.not-content *))) {
-		font-size: var(--sl-text-h4);
-	}
-	.content :global(h5:not(:where(.not-content *))) {
-		font-size: var(--sl-text-h5);
-	}
-	.content :global(h6:not(:where(.not-content *))) {
-		font-size: var(--sl-text-h6);
-	}
-
-	.content :global(a:not(:where(.not-content *))) {
-		color: var(--sl-color-text-accent);
-	}
-	.content :global(a:hover:not(:where(.not-content *))) {
-		color: var(--sl-color-white);
-	}
-
-	.content :global(code:not(:where(.not-content *))) {
-		background-color: var(--sl-color-bg-inline-code);
-		margin-block: -0.125rem;
-		padding: 0.125rem 0.375rem;
-		font-size: var(--sl-text-code-sm);
-	}
-	.content :global(:is(h1, h2, h3, h4, h5, h6) code) {
-		font-size: inherit;
-	}
-
-	.content :global(pre:not(:where(.not-content *))) {
-		border: 1px solid var(--sl-color-gray-5);
-		padding: 0.75rem 1rem;
-		font-size: var(--sl-text-code);
-		tab-size: 2;
-	}
-
-	.content :global(pre code:not(:where(.not-content *))) {
-		all: unset;
-		font-family: var(--__sl-font-mono);
-	}
-
-	.content :global(blockquote:not(:where(.not-content *))) {
-		border-inline-start: 1px solid var(--sl-color-gray-5);
-		padding-inline-start: 1rem;
-	}
-
-	.content :global(table:not(:where(.not-content *))) {
-		display: block;
-		overflow: auto;
-		border-collapse: collapse;
-	}
-	.content :global(tr:nth-child(2n):not(:where(.not-content *))) {
-		background-color: var(--sl-color-gray-7, var(--sl-color-gray-6));
-	}
-	.content :global(:is(th, td):not(:where(.not-content *))) {
-		border: 1px solid var(--sl-color-hairline-light);
-		padding: 0.375rem 0.8125rem;
-	}
-
-	.content :global(hr:not(:where(.not-content *))) {
-		border: 0;
-		border-bottom: 1px solid var(--sl-color-hairline);
-	}
-</style>
+<div class="sl-markdown-content"><slot /></div>

package/integrations/sitemap.ts

@@ -1,19 +1,23 @@
 import sitemap, { type SitemapOptions } from '@astrojs/sitemap';
 import type { StarlightConfig } from '../types';
 
-/**
- * A wrapped version of the `@astrojs/sitemap` integration configured based
- * on Starlight i18n config.
- */
-export function starlightSitemap(opts: StarlightConfig) {
+export function getSitemapConfig(opts: StarlightConfig): SitemapOptions {
 	const sitemapConfig: SitemapOptions = {};
 	if (opts.isMultilingual) {
 		sitemapConfig.i18n = {
-			defaultLocale: opts.defaultLocale.locale! || 'root',
+			defaultLocale: opts.defaultLocale.locale || 'root',
 			locales: Object.fromEntries(
 				Object.entries(opts.locales).map(([locale, config]) => [locale, config?.lang!])
 			),
 		};
 	}
-	return sitemap(sitemapConfig);
+	return sitemapConfig;
+}
+
+/**
+ * A wrapped version of the `@astrojs/sitemap` integration configured based
+ * on Starlight i18n config.
+ */
+export function starlightSitemap(opts: StarlightConfig) {
+	return sitemap(getSitemapConfig(opts));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astrojs/starlight",
-  "version": "0.12.0",
+  "version": "0.12.1",
   "description": "Build beautiful, high-performance documentation websites with Astro",
   "keywords": [
     "docs",
@@ -154,12 +154,14 @@
     "./schema": "./schema.ts",
     "./types": "./types.ts",
     "./index.astro": "./index.astro",
-    "./404.astro": "./404.astro"
+    "./404.astro": "./404.astro",
+    "./style/markdown.css": "./style/markdown.css"
   },
   "peerDependencies": {
     "astro": "^3.2.0"
   },
   "devDependencies": {
+    "@astrojs/markdown-remark": "^3.2.1",
     "@types/node": "^18.16.19",
     "@vitest/coverage-v8": "^0.33.0",
     "astro": "^3.2.3",

package/style/markdown.css

@@ -0,0 +1,115 @@
+.sl-markdown-content
+	:not(a, strong, em, del, span, input, code)
+	+ :not(a, strong, em, del, span, input, code, :where(.not-content *)) {
+	margin-top: 1.5rem;
+}
+
+/* Headings after non-headings have more spacing. */
+.sl-markdown-content
+	:not(h1, h2, h3, h4, h5, h6)
+	+ :is(h1, h2, h3, h4, h5, h6):not(:where(.not-content *)) {
+	margin-top: 2.5rem;
+}
+
+.sl-markdown-content li + li:not(:where(.not-content *)),
+.sl-markdown-content dt + dt:not(:where(.not-content *)),
+.sl-markdown-content dt + dd:not(:where(.not-content *)),
+.sl-markdown-content dd + dd:not(:where(.not-content *)) {
+	margin-top: 0.25rem;
+}
+
+.sl-markdown-content
+	li
+	> :last-child:not(li, ul, ol):not(a, strong, em, del, span, input, :where(.not-content *)) {
+	margin-bottom: 1.25rem;
+}
+
+.sl-markdown-content dt:not(:where(.not-content *)) {
+	font-weight: 700;
+}
+.sl-markdown-content dd:not(:where(.not-content *)) {
+	padding-inline-start: 1rem;
+}
+
+.sl-markdown-content :is(h1, h2, h3, h4, h5, h6):not(:where(.not-content *)) {
+	color: var(--sl-color-white);
+	line-height: var(--sl-line-height-headings);
+	font-weight: 600;
+}
+
+.sl-markdown-content :is(img, picture, video, canvas, svg, iframe):not(:where(.not-content *)) {
+	display: block;
+	max-width: 100%;
+	height: auto;
+}
+
+.sl-markdown-content h1:not(:where(.not-content *)) {
+	font-size: var(--sl-text-h1);
+}
+.sl-markdown-content h2:not(:where(.not-content *)) {
+	font-size: var(--sl-text-h2);
+}
+.sl-markdown-content h3:not(:where(.not-content *)) {
+	font-size: var(--sl-text-h3);
+}
+.sl-markdown-content h4:not(:where(.not-content *)) {
+	font-size: var(--sl-text-h4);
+}
+.sl-markdown-content h5:not(:where(.not-content *)) {
+	font-size: var(--sl-text-h5);
+}
+.sl-markdown-content h6:not(:where(.not-content *)) {
+	font-size: var(--sl-text-h6);
+}
+
+.sl-markdown-content a:not(:where(.not-content *)) {
+	color: var(--sl-color-text-accent);
+}
+.sl-markdown-content a:hover:not(:where(.not-content *)) {
+	color: var(--sl-color-white);
+}
+
+.sl-markdown-content code:not(:where(.not-content *)) {
+	background-color: var(--sl-color-bg-inline-code);
+	margin-block: -0.125rem;
+	padding: 0.125rem 0.375rem;
+	font-size: var(--sl-text-code-sm);
+}
+.sl-markdown-content :is(h1, h2, h3, h4, h5, h6) code {
+	font-size: inherit;
+}
+
+.sl-markdown-content pre:not(:where(.not-content *)) {
+	border: 1px solid var(--sl-color-gray-5);
+	padding: 0.75rem 1rem;
+	font-size: var(--sl-text-code);
+	tab-size: 2;
+}
+
+.sl-markdown-content pre code:not(:where(.not-content *)) {
+	all: unset;
+	font-family: var(--__sl-font-mono);
+}
+
+.sl-markdown-content blockquote:not(:where(.not-content *)) {
+	border-inline-start: 1px solid var(--sl-color-gray-5);
+	padding-inline-start: 1rem;
+}
+
+.sl-markdown-content table:not(:where(.not-content *)) {
+	display: block;
+	overflow: auto;
+	border-collapse: collapse;
+}
+.sl-markdown-content tr:nth-child(2n):not(:where(.not-content *)) {
+	background-color: var(--sl-color-gray-7, var(--sl-color-gray-6));
+}
+.sl-markdown-content :is(th, td):not(:where(.not-content *)) {
+	border: 1px solid var(--sl-color-hairline-light);
+	padding: 0.375rem 0.8125rem;
+}
+
+.sl-markdown-content hr:not(:where(.not-content *)) {
+	border: 0;
+	border-bottom: 1px solid var(--sl-color-hairline);
+}

package/utils/createTranslationSystem.ts

@@ -1,5 +1,5 @@
 import type { i18nSchemaOutput } from '../schemas/i18n';
-import builtinTranslations from '../translations';
+import builtinTranslations from '../translations/index';
 import type { StarlightConfig } from './user-config';
 
 export function createTranslationSystem(

package/utils/navigation.ts

@@ -135,7 +135,7 @@ function makeLink(
 	attrs?: LinkHTMLAttributes
 ): Link {
 	if (!isAbsolute(href)) href = pathWithBase(href);
-	const isCurrent = href === ensureTrailingSlash(currentPathname);
+	const isCurrent = encodeURI(href) === ensureTrailingSlash(currentPathname);
 	return { type: 'link', label, href, isCurrent, badge, attrs: attrs ?? {} };
 }
 

package/utils/route-data.ts

@@ -66,9 +66,9 @@ function getToC({ entry, locale, headings }: PageProps) {
 	};
 }
 
-function getLastUpdated({ entry, id }: PageProps): Date | undefined {
+function getLastUpdated({ entry }: PageProps): Date | undefined {
 	if (entry.data.lastUpdated ?? config.lastUpdated) {
-		const currentFilePath = fileURLToPath(new URL('src/content/docs/' + id, project.root));
+		const currentFilePath = fileURLToPath(new URL('src/content/docs/' + entry.id, project.root));
 		let date = typeof entry.data.lastUpdated !== 'boolean' ? entry.data.lastUpdated : undefined;
 		if (!date) {
 			try {