@astrojs/starlight 0.7.0 → 0.7.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @astrojs/starlight
 
+## 0.7.1
+
+### Patch Changes
+
+- [#488](https://github.com/withastro/starlight/pull/488) [`da35556`](https://github.com/withastro/starlight/commit/da35556eb95f2d397dfce03cc4acfacb0dcf1e89) Thanks [@mayank99](https://github.com/mayank99)! - Improved accessibility of LinkCard by only including the title as part of the link text, and using a pseudo-element to keep the card clickable.
+
+- [#489](https://github.com/withastro/starlight/pull/489) [`35cd82e`](https://github.com/withastro/starlight/commit/35cd82e7f8622772a5155add99ad8baf61ae08a1) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Respect `hidden` sidebar frontmatter property when no sidebar configuration is provided
+
 ## 0.7.0
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astrojs/starlight",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "Build beautiful, high-performance documentation websites with Astro",
   "keywords": [
     "docs",
@@ -33,7 +33,7 @@
   "devDependencies": {
     "@types/node": "^18.16.19",
     "@vitest/coverage-v8": "^0.33.0",
-    "astro": "^2.10.4",
+    "astro": "^2.10.5",
     "vitest": "^0.33.0"
   },
   "dependencies": {

package/user-components/LinkCard.astro

@@ -11,25 +11,36 @@ const { title, description, ...attributes } = Astro.props;
 ---
 
 <div>
-	<a {...attributes}>
-		<span class="flex stack">
+	<span class="flex stack">
+		<a {...attributes}>
 			<span class="title" set:html={title} />
-			{description && <span class="description" set:html={description} />}
-		</span>
-		<Icon name="right-arrow" size="1.333em" class="icon rtl:flip" />
-	</a>
+		</a>
+		{description && <span class="description" set:html={description} />}
+	</span>
+	<Icon name="right-arrow" size="1.333em" class="icon rtl:flip" />
 </div>
 
 <style>
-	a {
+	div {
 		display: grid;
 		grid-template-columns: 1fr auto;
 		gap: 0.5rem;
 		border: 1px solid var(--sl-color-gray-5);
 		border-radius: 0.5rem;
 		padding: 1rem;
-		text-decoration: none;
 		box-shadow: var(--sl-shadow-sm);
+		position: relative;
+	}
+
+	a {
+		text-decoration: none;
+	}
+
+	/* a11y fix for https://github.com/withastro/starlight/issues/487 */
+	a::before {
+		content: '';
+		position: absolute;
+		inset: 0;
 	}
 
 	.stack {
@@ -54,12 +65,12 @@ const { title, description, ...attributes } = Astro.props;
 	}
 
 	/* Hover state */
-	a:hover {
+	div:hover {
 		background: var(--sl-color-gray-7, var(--sl-color-gray-6));
 		border-color: var(--sl-color-gray-2);
 	}
 
-	a:hover .icon {
+	div:hover .icon {
 		color: var(--sl-color-white);
 	}
 </style>

package/utils/navigation.ts

@@ -83,11 +83,9 @@ function groupFromAutogenerateConfig(
 	const dirDocs = routes.filter(
 		(doc) =>
 			// Match against `foo.md` or `foo/index.md`.
-			(stripExtension(doc.id) === localeDir ||
-				// Match against `foo/anything/else.md`.
-				doc.id.startsWith(localeDir + '/')) &&
-			// Remove any entries that should be hidden
-			!doc.entry.data.sidebar.hidden
+			stripExtension(doc.id) === localeDir ||
+			// Match against `foo/anything/else.md`.
+			doc.id.startsWith(localeDir + '/')
 	);
 	const tree = treeify(dirDocs, localeDir);
 	return {
@@ -145,20 +143,23 @@ function getBreadcrumbs(path: string, baseDir: string): string[] {
 /** Turn a flat array of routes into a tree structure. */
 function treeify(routes: Route[], baseDir: string): Dir {
 	const treeRoot: Dir = makeDir();
-	routes.forEach((doc) => {
-		const breadcrumbs = getBreadcrumbs(doc.id, baseDir);
+	routes
+		// Remove any entries that should be hidden
+		.filter((doc) => !doc.entry.data.sidebar.hidden)
+		.forEach((doc) => {
+			const breadcrumbs = getBreadcrumbs(doc.id, baseDir);
 
-		// Walk down the route’s path to generate the tree.
-		let currentDir = treeRoot;
-		breadcrumbs.forEach((dir) => {
-			// Create new folder if needed.
-			if (typeof currentDir[dir] === 'undefined') currentDir[dir] = makeDir();
-			// Go into the subdirectory.
-			currentDir = currentDir[dir] as Dir;
+			// Walk down the route’s path to generate the tree.
+			let currentDir = treeRoot;
+			breadcrumbs.forEach((dir) => {
+				// Create new folder if needed.
+				if (typeof currentDir[dir] === 'undefined') currentDir[dir] = makeDir();
+				// Go into the subdirectory.
+				currentDir = currentDir[dir] as Dir;
+			});
+			// We’ve walked through the path. Register the route in this directory.
+			currentDir[basename(doc.slug)] = doc;
 		});
-		// We’ve walked through the path. Register the route in this directory.
-		currentDir[basename(doc.slug)] = doc;
-	});
 	return treeRoot;
 }