diff --git a/docs/src/components/icons-list.astro b/docs/src/components/icons-list.astro index 9c83c7b12c1..e0e37a98207 100644 --- a/docs/src/components/icons-list.astro +++ b/docs/src/components/icons-list.astro @@ -1,6 +1,6 @@ --- import { Icon } from '@astrojs/starlight/components'; -import { Icons } from '../../../packages/starlight/components/Icons'; +import { Icons, type StarlightIcon } from '../../../packages/starlight/components/Icons'; interface Props { labels?: { @@ -10,7 +10,7 @@ interface Props { const { copied = 'Copied!' } = Astro.props.labels ?? {}; -const icons = Object.keys(Icons) as (keyof typeof Icons)[]; +const icons = Object.keys(Icons) as StarlightIcon[]; ---
diff --git a/packages/starlight/__tests__/remark-rehype/rehype-file-tree.test.ts b/packages/starlight/__tests__/remark-rehype/rehype-file-tree.test.ts index 36e8cb41793..5c94c7e5c82 100644 --- a/packages/starlight/__tests__/remark-rehype/rehype-file-tree.test.ts +++ b/packages/starlight/__tests__/remark-rehype/rehype-file-tree.test.ts @@ -1,6 +1,6 @@ import { describe, expect, test } from 'vitest'; import { processFileTree } from '../../user-components/rehype-file-tree'; -import { Icons } from '../../components/Icons'; +import { Icons, type StarlightIcon } from '../../components/Icons'; describe('validation', () => { test('throws an error with no content', () => { @@ -176,6 +176,6 @@ function extractFileTree(html: string, stripIcons = true) { return tree; } -function expectHtmlToIncludeIcon(html: string, icon: (typeof Icons)[keyof typeof Icons]) { +function expectHtmlToIncludeIcon(html: string, icon: (typeof Icons)[StarlightIcon]) { return expect(extractFileTree(html, false)).toContain(icon.replace('/>', '>')); } diff --git a/packages/starlight/components/ContentNotice.astro b/packages/starlight/components/ContentNotice.astro index 9c354f9313b..fcf4ac3dbcc 100644 --- a/packages/starlight/components/ContentNotice.astro +++ b/packages/starlight/components/ContentNotice.astro @@ -1,9 +1,9 @@ --- -import { Icons } from '../components/Icons'; +import type { StarlightIcon } from '../components/Icons'; import Icon from '../user-components/Icon.astro'; interface Props { - icon: keyof typeof Icons; + icon: StarlightIcon; label: string; } diff --git a/packages/starlight/schemas/hero.ts b/packages/starlight/schemas/hero.ts index 6ecc50df135..86105523596 100644 --- a/packages/starlight/schemas/hero.ts +++ b/packages/starlight/schemas/hero.ts @@ -1,9 +1,8 @@ import { z } from 'astro/zod'; import type { SchemaContext } from 'astro:content'; -import { Icons } from '../components/Icons'; +import { Icons, type StarlightIcon } from '../components/Icons'; -type IconName = keyof typeof Icons; -const iconNames = Object.keys(Icons) as [IconName, ...IconName[]]; +const iconNames = Object.keys(Icons) as [StarlightIcon, ...StarlightIcon[]]; export const HeroSchema = ({ image }: SchemaContext) => z.object({ diff --git a/packages/starlight/user-components/Card.astro b/packages/starlight/user-components/Card.astro index 6b95e5bf88d..d7ead9c97bf 100644 --- a/packages/starlight/user-components/Card.astro +++ b/packages/starlight/user-components/Card.astro @@ -1,9 +1,9 @@ --- import Icon from './Icon.astro'; -import type { Icons } from '../components/Icons'; +import type { StarlightIcon } from '../components/Icons'; interface Props { - icon?: keyof typeof Icons; + icon?: StarlightIcon; title: string; } diff --git a/packages/starlight/user-components/LinkButton.astro b/packages/starlight/user-components/LinkButton.astro index 3bf68f073d7..3afa2bb65b0 100644 --- a/packages/starlight/user-components/LinkButton.astro +++ b/packages/starlight/user-components/LinkButton.astro @@ -1,11 +1,11 @@ --- import type { HTMLAttributes } from 'astro/types'; -import { Icons } from '../components/Icons'; +import type { StarlightIcon } from '../components/Icons'; import Icon from './Icon.astro'; interface Props extends Omit, 'href'> { href: string | URL; - icon?: keyof typeof Icons | undefined; + icon?: StarlightIcon | undefined; iconPlacement?: 'start' | 'end' | undefined; variant?: 'primary' | 'secondary' | 'minimal'; } diff --git a/packages/starlight/user-components/TabItem.astro b/packages/starlight/user-components/TabItem.astro index a7dfe634f50..0bd9fa6df54 100644 --- a/packages/starlight/user-components/TabItem.astro +++ b/packages/starlight/user-components/TabItem.astro @@ -1,9 +1,9 @@ --- import { TabItemTagname } from './rehype-tabs'; -import type { Icons } from '../components/Icons'; +import type { StarlightIcon } from '../components/Icons'; interface Props { - icon?: keyof typeof Icons; + icon?: StarlightIcon; label: string; } diff --git a/packages/starlight/user-components/rehype-file-tree.ts b/packages/starlight/user-components/rehype-file-tree.ts index 1bdb19072a5..72f658a03c1 100644 --- a/packages/starlight/user-components/rehype-file-tree.ts +++ b/packages/starlight/user-components/rehype-file-tree.ts @@ -6,7 +6,7 @@ import { fromHtml } from 'hast-util-from-html'; import { toString } from 'hast-util-to-string'; import { rehype } from 'rehype'; import { CONTINUE, SKIP, visit } from 'unist-util-visit'; -import { Icons } from '../components/Icons'; +import { Icons, type StarlightIcon } from '../components/Icons'; import { definitions } from './file-tree-icons'; declare module 'vfile' { @@ -160,7 +160,7 @@ function getFileIcon(fileName: string) { const name = getFileIconName(fileName); if (!name) return defaultFileIcon; if (name in Icons) { - const path = Icons[name as keyof typeof Icons]; + const path = Icons[name as StarlightIcon]; return makeSVGIcon(path); } return defaultFileIcon; diff --git a/packages/starlight/user-components/rehype-tabs.ts b/packages/starlight/user-components/rehype-tabs.ts index e7e40ebf9f2..b989a81fda8 100644 --- a/packages/starlight/user-components/rehype-tabs.ts +++ b/packages/starlight/user-components/rehype-tabs.ts @@ -2,13 +2,13 @@ import type { Element } from 'hast'; import { select } from 'hast-util-select'; import { rehype } from 'rehype'; import { CONTINUE, SKIP, visit } from 'unist-util-visit'; -import { Icons } from '../components/Icons'; +import type { StarlightIcon } from '../components/Icons'; interface Panel { panelId: string; tabId: string; label: string; - icon?: keyof typeof Icons; + icon?: StarlightIcon; } declare module 'vfile' { @@ -67,7 +67,7 @@ const tabsProcessor = rehype() ...ids, label: String(dataLabel), }; - if (dataIcon) panel.icon = String(dataIcon) as keyof typeof Icons; + if (dataIcon) panel.icon = String(dataIcon) as StarlightIcon; file.data.panels?.push(panel); // Remove `` props