starlight-obsidian 0.8.2 → 0.9.0

package/CHANGELOG.md

@@ -1,5 +1,33 @@
 # starlight-obsidian
 
+## 0.9.0
+
+### Minor Changes
+
+- [#53](https://github.com/HiDeoo/starlight-obsidian/pull/53) [`be89246`](https://github.com/HiDeoo/starlight-obsidian/commit/be8924661655c041a7339d040c4518e74e39defb) Thanks [@HiDeoo](https://github.com/HiDeoo)! - ⚠️ **BREAKING CHANGE:** The minimum supported version of Starlight is now version `0.34.0`.
+
+  Please use the `@astrojs/upgrade` command to upgrade your project:
+
+  ```sh
+  npx @astrojs/upgrade
+  ```
+
+- [#53](https://github.com/HiDeoo/starlight-obsidian/pull/53) [`be89246`](https://github.com/HiDeoo/starlight-obsidian/commit/be8924661655c041a7339d040c4518e74e39defb) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Removes the `autoLinkHeadings` option.
+
+  ⚠️ **BREAKING CHANGE:** The `autoLinkHeadings` option has been removed and this feature is now built-in to Starlight and configurable using the Starlight [`markdown.headingLinks` configuration option](https://starlight.astro.build/reference/configuration/#headinglinks) which is enabled by default.
+
+  To conserve the previous default behavior of the plugin, set `markdown.headingLinks` to `false` in your Starlight configuration.
+
+  ```js
+  // astro.config.mjs
+  starlight({
+    markdown: {
+      // Disable Starlight’s clickable heading anchor links.
+      headingLinks: false,
+    },
+  }),
+  ```
+
 ## 0.8.2
 
 ### Patch Changes

package/index.ts

@@ -10,12 +10,6 @@ import { throwUserError } from './libs/plugin'
 import { addObsidianFiles, getSidebarFromConfig, getSidebarGroupPlaceholder, type SidebarGroup } from './libs/starlight'
 
 const starlightObsidianConfigSchema = z.object({
-  /**
-   * Add links to Starlight headings to make it easier to share a link to a specific section of a page.
-   *
-   * @default false
-   */
-  autoLinkHeadings: z.boolean().default(false),
   /**
    * The name of the Obsidian vault configuration folder if different from the default one.
    *
@@ -165,18 +159,12 @@ function makeStarlightObsidianPlugin(
             addRouteMiddleware({ entrypoint: 'starlight-obsidian/middleware' })
           }
 
-          const customCss = [...(starlightConfig.customCss ?? []), 'starlight-obsidian/styles/common']
-
-          if (config.autoLinkHeadings) {
-            customCss.push('starlight-obsidian/styles/autolinks-headings')
-          }
-
           const updatedStarlightConfig: Partial<StarlightUserConfig> = {
             components: {
               ...starlightConfig.components,
               ...overrideStarlightComponent(starlightConfig.components, logger, 'PageTitle'),
             },
-            customCss,
+            customCss: [...(starlightConfig.customCss ?? []), 'starlight-obsidian/styles/common'],
             sidebar: getSidebarFromConfig(config, starlightConfig.sidebar, sidebarGroup),
           }
 

package/libs/integration.ts

@@ -1,12 +1,10 @@
-import { rehypeHeadingIds } from '@astrojs/markdown-remark'
 import type { AstroIntegration } from 'astro'
-import rehypeAutolinkHeadings from 'rehype-autolink-headings'
 import rehypeKatex from 'rehype-katex'
 import remarkMath from 'remark-math'
 
 import type { StarlightObsidianConfig } from '..'
 
-import { getRehypeAutolinkHeadingsOptions, rehypeStarlightObsidian } from './rehype'
+import { rehypeStarlightObsidian } from './rehype'
 import { vitePluginStarlightObsidianConfig } from './vite'
 
 export function starlightObsidianIntegration(config: StarlightObsidianConfig): AstroIntegration {
@@ -16,13 +14,7 @@ export function starlightObsidianIntegration(config: StarlightObsidianConfig): A
       'astro:config:setup': ({ updateConfig }) => {
         updateConfig({
           markdown: {
-            rehypePlugins: [
-              ...(config.autoLinkHeadings
-                ? [rehypeHeadingIds, [rehypeAutolinkHeadings, getRehypeAutolinkHeadingsOptions()]]
-                : []),
-              rehypeStarlightObsidian,
-              rehypeKatex,
-            ],
+            rehypePlugins: [rehypeStarlightObsidian, rehypeKatex],
             remarkPlugins: [remarkMath],
           },
           vite: {

package/libs/rehype.ts

@@ -1,9 +1,5 @@
 import type { Element, ElementContent, Root } from 'hast'
-import { toString } from 'hast-util-to-string'
-import { h } from 'hastscript'
-import { escape } from 'html-escaper'
 import type { Literal } from 'mdast'
-import type { Options as RehypeAutolinkHeadingsOptions } from 'rehype-autolink-headings'
 import { CONTINUE, SKIP, visit } from 'unist-util-visit'
 
 const blockIdentifierRegex = /(?<identifier> *\^(?<name>[\w-]+))$/
@@ -42,24 +38,6 @@ export function rehypeStarlightObsidian() {
   }
 }
 
-// https://hideoo.dev/notes/starlight-heading-links
-// https://github.com/withastro/docs/blob/main/plugins/rehype-autolink.ts
-// https://amberwilson.co.uk/blog/are-your-anchor-links-accessible/
-export function getRehypeAutolinkHeadingsOptions(): RehypeAutolinkHeadingsOptions {
-  return {
-    behavior: 'after',
-    content: (heading) => {
-      return [
-        h('span', { ariaHidden: 'true' }, '§'),
-        h('span', { class: 'sr-only' }, `Section titled ${escape(toString(heading))}`),
-      ]
-    },
-    group: ({ tagName }) =>
-      h('div', { class: `sl-obs-section sl-obs-section-level-${tagName.slice(1)}`, tabIndex: -1 }),
-    properties: { class: 'sl-obs-heading-link' },
-  }
-}
-
 function transformBlockIdentifier(reference: Element, node: ElementContent | undefined) {
   if (!isNodeWithValue(node)) {
     return CONTINUE

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "starlight-obsidian",
-  "version": "0.8.2",
+  "version": "0.9.0",
   "license": "MIT",
   "description": "Starlight plugin to publish Obsidian vaults.",
   "author": "HiDeoo <github@hideoo.dev> (https://hideoo.dev)",
@@ -14,27 +14,21 @@
     "./overrides/PageTitle.astro": "./overrides/PageTitle.astro",
     "./schema": "./schema.ts",
     "./styles/common": "./styles/common.css",
-    "./styles/autolinks-headings": "./styles/autolinks-headings.css",
     "./package.json": "./package.json"
   },
   "dependencies": {
     "@astro-community/astro-embed-twitter": "^0.5.8",
     "@astro-community/astro-embed-youtube": "^0.5.6",
-    "@astrojs/markdown-remark": "^6.0.0",
     "decode-uri-component": "^0.4.1",
     "github-slugger": "^2.0.0",
     "globby": "^14.0.2",
     "hast-util-to-html": "^9.0.4",
-    "hast-util-to-string": "^3.0.1",
-    "hastscript": "^9.0.0",
-    "html-escaper": "^3.0.3",
     "is-absolute-url": "^4.0.1",
     "mdast-util-find-and-replace": "^3.0.1",
     "mdast-util-from-markdown": "^2.0.2",
     "mdast-util-to-hast": "^13.2.0",
     "nanoid": "^5.0.9",
     "rehype": "^13.0.2",
-    "rehype-autolink-headings": "^7.1.0",
     "rehype-katex": "^7.0.1",
     "rehype-mermaid": "^2.1.0",
     "remark": "^15.0.1",
@@ -47,7 +41,6 @@
   },
   "devDependencies": {
     "@types/hast": "^3.0.4",
-    "@types/html-escaper": "^3.0.2",
     "@types/mdast": "^4.0.4",
     "@types/node": "^18.19.68",
     "@types/unist": "^3.0.3",
@@ -55,7 +48,7 @@
     "vitest": "2.1.6"
   },
   "peerDependencies": {
-    "@astrojs/starlight": ">=0.32.0"
+    "@astrojs/starlight": ">=0.34.0"
   },
   "engines": {
     "node": ">=18.17.1"

package/styles/autolinks-headings.css

@@ -1,68 +0,0 @@
-.sl-markdown-content :not(.sl-obs-section) + :is(.sl-obs-section):not(:where(.not-content *)) {
-  margin-top: 1.5em;
-}
-
-.sl-markdown-content .sl-obs-section {
-  --sl-obs-heading-link-spacing: 0.25em;
-
-  line-height: var(--sl-line-height-headings);
-}
-
-.sl-markdown-content .sl-obs-section.sl-obs-section-level-1 {
-  font-size: var(--sl-text-h1);
-}
-
-.sl-markdown-content .sl-obs-section.sl-obs-section-level-2 {
-  font-size: var(--sl-text-h2);
-}
-
-.sl-markdown-content .sl-obs-section.sl-obs-section-level-3 {
-  font-size: var(--sl-text-h3);
-}
-
-.sl-markdown-content .sl-obs-section.sl-obs-section-level-4 {
-  font-size: var(--sl-text-h4);
-}
-
-.sl-markdown-content .sl-obs-section.sl-obs-section-level-5 {
-  font-size: var(--sl-text-h5);
-}
-
-.sl-markdown-content .sl-obs-section.sl-obs-section-level-6 {
-  font-size: var(--sl-text-h6);
-}
-
-.sl-markdown-content .sl-obs-section > :first-child {
-  display: inline;
-  margin-inline-end: var(--sl-obs-heading-link-spacing);
-}
-
-.sl-markdown-content .sl-obs-heading-link {
-  color: var(--sl-color-gray-3);
-  text-decoration: none;
-}
-
-.sl-markdown-content .sl-obs-heading-link:is(:hover, :focus) {
-  color: var(--sl-color-text-accent);
-}
-
-@media (hover: hover) {
-  .sl-markdown-content .sl-obs-heading-link {
-    opacity: 0;
-  }
-}
-
-.sl-markdown-content .sl-obs-section:hover > .sl-obs-heading-link,
-.sl-markdown-content .sl-obs-heading-link:focus {
-  opacity: 1;
-}
-
-@media (min-width: 95em) {
-  .sl-markdown-content .sl-obs-section {
-    display: flex;
-    flex-direction: row-reverse;
-    gap: var(--sl-obs-heading-link-spacing);
-    justify-content: flex-end;
-    margin-inline-start: calc(-1 * (1ch + var(--sl-obs-heading-link-spacing)));
-  }
-}