Missing "./constants" specifier in "@astrojs/starlight" package

[kdheepak]

What version of starlight are you using?

0.13.1

What version of astro are you using?

3.2.3

What package manager are you using?

npm

What operating system are you using?

Mac

What browser are you using?

Firefox

Describe the Bug

I guess this is more of a question than a bug report.

I was trying to override the Hero component with a component that had the following frontmatter:

---
import { Image } from "astro:assets";
import { PAGE_TITLE_ID } from "@astrojs/starlight/constants";
import type { Props } from "@astrojs/starlight/props";
import CallToAction from "@astrojs/starlight/components/CallToAction.astro";
...

but wasn't able to import PAGE_TITLE_ID. Is that expected?

Link to Minimal Reproducible Example

Participation

• I am willing to submit a pull request for this issue.

[HiDeoo]

Thanks for your report.

but wasn't able to import PAGE_TITLE_ID. Is that expected?

Indeed, at the moment this is not possible. This is tracked in this issue and more spefically this comment which contains a section regarding constants:

Maybe we take a similar approach and expose constants on the route data objects as well to avoid documenting the extra export? I agree that it’s useful to have this exposed — I already had to use _top without the constant in a docs example.

The only workaround at the moment to use the hardcoded string _top for now.

Note that depending on your need, it's also possible to re-use the <Hero/> component built-in with Starlight in your component override so that you don't have to re-implement it from scratch and would not have this issue but it depends on your use case and what you want to achieve.

[kdheepak]

Note that depending on your need, it's also possible to re-use the component built-in with Starlight in your component override so that you don't have to re-implement it from scratch and would not have this issue but it depends on your use case and what you want to achieve.

Good idea! I wanted to change the layout of the Hero component and I assume that the only way was to reimplement it. I have hardcoded _top for now.