From 5bf44577634935b9fa6d50b040abcd680035075f Mon Sep 17 00:00:00 2001 From: Kevin Zuniga Cuellar <46791833+kevinzunigacuellar@users.noreply.github.com> Date: Wed, 1 Nov 2023 14:41:53 -0700 Subject: [PATCH 01/22] feat: add support for adding sidebar badges to group headings (#995) Co-authored-by: HiDeoo <494699+HiDeoo@users.noreply.github.com> Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com> --- .changeset/orange-pants-tell.md | 5 ++++ docs/src/components/sidebar-preview.astro | 1 + docs/src/content/docs/guides/sidebar.mdx | 26 ++++++++++++++++++- .../content/docs/reference/configuration.mdx | 2 +- .../basics/navigation-labels.test.ts | 1 + .../__tests__/basics/navigation-order.test.ts | 1 + .../__tests__/basics/navigation.test.ts | 1 + .../__tests__/i18n/navigation-order.test.ts | 4 +++ .../sidebar/navigation-attributes.test.ts | 6 +++++ .../sidebar/navigation-badges.test.ts | 6 +++++ .../sidebar/navigation-hidden.test.ts | 6 +++++ .../sidebar/navigation-order.test.ts | 6 +++++ .../__tests__/sidebar/navigation.test.ts | 6 +++++ .../__tests__/sidebar/vitest.config.ts | 1 + .../starlight/components/SidebarSublist.astro | 16 +++++++++--- packages/starlight/schemas/sidebar.ts | 4 +-- packages/starlight/utils/navigation.ts | 4 +++ 17 files changed, 89 insertions(+), 7 deletions(-) create mode 100644 .changeset/orange-pants-tell.md diff --git a/.changeset/orange-pants-tell.md b/.changeset/orange-pants-tell.md new file mode 100644 index 0000000000..a11ff966b7 --- /dev/null +++ b/.changeset/orange-pants-tell.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': minor +--- + +Adds support for adding sidebar badges to group headings diff --git a/docs/src/components/sidebar-preview.astro b/docs/src/components/sidebar-preview.astro index 732e766e08..bd10705d16 100644 --- a/docs/src/components/sidebar-preview.astro +++ b/docs/src/components/sidebar-preview.astro @@ -29,6 +29,7 @@ function makeEntries(items: SidebarConfig): SidebarEntry[] { label: item.label, entries: makeEntries(item.items as SidebarConfig), collapsed: item.collapsed, + badge: item.badge, }; }); } diff --git a/docs/src/content/docs/guides/sidebar.mdx b/docs/src/content/docs/guides/sidebar.mdx index 4370c9cc75..47d156df29 100644 --- a/docs/src/content/docs/guides/sidebar.mdx +++ b/docs/src/content/docs/guides/sidebar.mdx @@ -235,7 +235,7 @@ The `sidebar` frontmatter configuration is only used for autogenerated links and ## Badges -Links can also include a `badge` property to display a badge next to the link label. +Links, groups, and autogenerated groups can also include a `badge` property to display a badge next to their label. ```js starlight({ @@ -251,6 +251,12 @@ starlight({ }, ], }, + // An autogenerated group with a "Deprecated" badge. + { + label: 'Reference', + badge: 'Deprecated', + autogenerate: { directory: 'reference' }, + }, ], }); ``` @@ -269,6 +275,24 @@ The configuration above generates the following sidebar: }, ], }, + { + label: 'Reference', + badge: { text: 'Deprecated', variant: 'default'}, + items: [ + { + label: 'Configuration Reference', + link: '/reference/configuration/', + }, + { + label: 'Frontmatter Reference', + link: '/reference/frontmatter/', + }, + { + label: 'Overrides Reference', + link: '/reference/overrides/', + }, + ], + }, ]} /> diff --git a/docs/src/content/docs/reference/configuration.mdx b/docs/src/content/docs/reference/configuration.mdx index 19647ff8aa..8d1dfe6aca 100644 --- a/docs/src/content/docs/reference/configuration.mdx +++ b/docs/src/content/docs/reference/configuration.mdx @@ -183,10 +183,10 @@ sidebar: [ type SidebarItem = { label: string; translations?: Record; + badge?: string | BadgeConfig; } & ( | { link: string; - badge?: string | BadgeConfig; attrs?: Record; } | { items: SidebarItem[]; collapsed?: boolean } diff --git a/packages/starlight/__tests__/basics/navigation-labels.test.ts b/packages/starlight/__tests__/basics/navigation-labels.test.ts index 646253508c..a85b48cbed 100644 --- a/packages/starlight/__tests__/basics/navigation-labels.test.ts +++ b/packages/starlight/__tests__/basics/navigation-labels.test.ts @@ -36,6 +36,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/basics/navigation-order.test.ts b/packages/starlight/__tests__/basics/navigation-order.test.ts index 089ad8dbdb..6bcd2186f0 100644 --- a/packages/starlight/__tests__/basics/navigation-order.test.ts +++ b/packages/starlight/__tests__/basics/navigation-order.test.ts @@ -17,6 +17,7 @@ describe('getSidebar', () => { expect(getSidebar('/', undefined)).toMatchInlineSnapshot(` [ { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/basics/navigation.test.ts b/packages/starlight/__tests__/basics/navigation.test.ts index 7661132203..3d76a38efe 100644 --- a/packages/starlight/__tests__/basics/navigation.test.ts +++ b/packages/starlight/__tests__/basics/navigation.test.ts @@ -34,6 +34,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/i18n/navigation-order.test.ts b/packages/starlight/__tests__/i18n/navigation-order.test.ts index 95ecf27cf5..fb37ca62d4 100644 --- a/packages/starlight/__tests__/i18n/navigation-order.test.ts +++ b/packages/starlight/__tests__/i18n/navigation-order.test.ts @@ -46,6 +46,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -84,6 +85,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -99,6 +101,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -122,6 +125,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/sidebar/navigation-attributes.test.ts b/packages/starlight/__tests__/sidebar/navigation-attributes.test.ts index 7949fc67b9..66d3b0df45 100644 --- a/packages/starlight/__tests__/sidebar/navigation-attributes.test.ts +++ b/packages/starlight/__tests__/sidebar/navigation-attributes.test.ts @@ -32,6 +32,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -72,6 +73,10 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": { + "text": "Experimental", + "variant": "default", + }, "collapsed": false, "entries": [ { @@ -90,6 +95,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/sidebar/navigation-badges.test.ts b/packages/starlight/__tests__/sidebar/navigation-badges.test.ts index e6cf12dca3..542ab869db 100644 --- a/packages/starlight/__tests__/sidebar/navigation-badges.test.ts +++ b/packages/starlight/__tests__/sidebar/navigation-badges.test.ts @@ -39,6 +39,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -79,6 +80,10 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": { + "text": "Experimental", + "variant": "default", + }, "collapsed": false, "entries": [ { @@ -108,6 +113,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/sidebar/navigation-hidden.test.ts b/packages/starlight/__tests__/sidebar/navigation-hidden.test.ts index 5614d5857f..34c028a3e7 100644 --- a/packages/starlight/__tests__/sidebar/navigation-hidden.test.ts +++ b/packages/starlight/__tests__/sidebar/navigation-hidden.test.ts @@ -28,6 +28,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -68,6 +69,10 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": { + "text": "Experimental", + "variant": "default", + }, "collapsed": false, "entries": [ { @@ -83,6 +88,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/sidebar/navigation-order.test.ts b/packages/starlight/__tests__/sidebar/navigation-order.test.ts index 18896a1d12..0c17e5b1fd 100644 --- a/packages/starlight/__tests__/sidebar/navigation-order.test.ts +++ b/packages/starlight/__tests__/sidebar/navigation-order.test.ts @@ -28,6 +28,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -68,6 +69,10 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": { + "text": "Experimental", + "variant": "default", + }, "collapsed": false, "entries": [ { @@ -91,6 +96,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/sidebar/navigation.test.ts b/packages/starlight/__tests__/sidebar/navigation.test.ts index 2300c5c087..9255313eaa 100644 --- a/packages/starlight/__tests__/sidebar/navigation.test.ts +++ b/packages/starlight/__tests__/sidebar/navigation.test.ts @@ -28,6 +28,7 @@ describe('getSidebar', () => { "type": "link", }, { + "badge": undefined, "collapsed": false, "entries": [ { @@ -68,6 +69,10 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": { + "text": "Experimental", + "variant": "default", + }, "collapsed": false, "entries": [ { @@ -91,6 +96,7 @@ describe('getSidebar', () => { "type": "group", }, { + "badge": undefined, "collapsed": false, "entries": [ { diff --git a/packages/starlight/__tests__/sidebar/vitest.config.ts b/packages/starlight/__tests__/sidebar/vitest.config.ts index 56944082f0..a33f9541b7 100644 --- a/packages/starlight/__tests__/sidebar/vitest.config.ts +++ b/packages/starlight/__tests__/sidebar/vitest.config.ts @@ -28,6 +28,7 @@ export default defineVitestConfig({ // A group linking to all pages in the reference directory. { label: 'Reference', + badge: 'Experimental', autogenerate: { directory: 'reference' }, }, // A group linking to all pages in the api/v1 directory. diff --git a/packages/starlight/components/SidebarSublist.astro b/packages/starlight/components/SidebarSublist.astro index 393edf58f5..417e2dbf9f 100644 --- a/packages/starlight/components/SidebarSublist.astro +++ b/packages/starlight/components/SidebarSublist.astro @@ -36,7 +36,15 @@ interface Props { open={flattenSidebar(entry.entries).some((i) => i.isCurrent) || !entry.collapsed} > - {entry.label} +
+ {entry.label} + {entry.badge && ( + <> + {' '} + + + )} +
@@ -78,7 +86,8 @@ interface Props { display: flex; align-items: center; justify-content: space-between; - padding-inline: var(--sl-sidebar-item-padding-inline); + padding: 0.2em var(--sl-sidebar-item-padding-inline); + line-height: 1.4; cursor: pointer; user-select: none; } @@ -120,7 +129,8 @@ interface Props { background-color: var(--sl-color-text-accent); } - a > *:not(:last-child) { + a > *:not(:last-child), + .group-label > *:not(:last-child) { margin-inline-end: 0.25em; } diff --git a/packages/starlight/schemas/sidebar.ts b/packages/starlight/schemas/sidebar.ts index 4ee106eaf1..86eb7f87e4 100644 --- a/packages/starlight/schemas/sidebar.ts +++ b/packages/starlight/schemas/sidebar.ts @@ -9,6 +9,8 @@ const SidebarBaseSchema = z.object({ label: z.string(), /** Translations of the `label` for each supported language. */ translations: z.record(z.string()).default({}), + /** Adds a badge to the link item */ + badge: BadgeConfigSchema(), }); const SidebarGroupSchema = SidebarBaseSchema.extend({ @@ -29,8 +31,6 @@ export const SidebarLinkItemHTMLAttributesSchema = () => linkHTMLAttributesSchem const SidebarLinkItemSchema = SidebarBaseSchema.extend({ /** The link to this item’s content. Can be a relative link to local files or the full URL of an external page. */ link: z.string(), - /** Adds a badge to the link item */ - badge: BadgeConfigSchema(), /** HTML attributes to add to the link item. */ attrs: SidebarLinkItemHTMLAttributesSchema(), }); diff --git a/packages/starlight/utils/navigation.ts b/packages/starlight/utils/navigation.ts index c8a45b4ade..5710f55320 100644 --- a/packages/starlight/utils/navigation.ts +++ b/packages/starlight/utils/navigation.ts @@ -30,6 +30,7 @@ interface Group { label: string; entries: (Link | Group)[]; collapsed: boolean; + badge: Badge | undefined; } export type SidebarEntry = Link | Group; @@ -75,6 +76,7 @@ function configItemToEntry( label: pickLang(item.translations, localeToLang(locale)) || item.label, entries: item.items.map((i) => configItemToEntry(i, currentPathname, locale, routes)), collapsed: item.collapsed, + badge: item.badge, }; } } @@ -101,6 +103,7 @@ function groupFromAutogenerateConfig( label: pickLang(item.translations, localeToLang(locale)) || item.label, entries: sidebarFromDir(tree, currentPathname, locale, subgroupCollapsed ?? item.collapsed), collapsed: item.collapsed, + badge: item.badge, }; } @@ -231,6 +234,7 @@ function groupFromDir( label: dirName, entries, collapsed, + badge: undefined, }; } From dcb5f7aae1650a60731e27cd13a6f5ac015cd1e9 Mon Sep 17 00:00:00 2001 From: kevinzunigacuellar Date: Wed, 1 Nov 2023 21:42:33 +0000 Subject: [PATCH 02/22] [ci] format --- docs/src/content/docs/guides/sidebar.mdx | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/src/content/docs/guides/sidebar.mdx b/docs/src/content/docs/guides/sidebar.mdx index 47d156df29..02571ad23a 100644 --- a/docs/src/content/docs/guides/sidebar.mdx +++ b/docs/src/content/docs/guides/sidebar.mdx @@ -252,11 +252,11 @@ starlight({ ], }, // An autogenerated group with a "Deprecated" badge. - { - label: 'Reference', - badge: 'Deprecated', - autogenerate: { directory: 'reference' }, - }, + { + label: 'Reference', + badge: 'Deprecated', + autogenerate: { directory: 'reference' }, + }, ], }); ``` @@ -276,9 +276,9 @@ The configuration above generates the following sidebar: ], }, { - label: 'Reference', - badge: { text: 'Deprecated', variant: 'default'}, - items: [ + label: 'Reference', + badge: { text: 'Deprecated', variant: 'default' }, + items: [ { label: 'Configuration Reference', link: '/reference/configuration/', @@ -292,7 +292,7 @@ The configuration above generates the following sidebar: link: '/reference/overrides/', }, ], - }, + }, ]} /> From 72cca2d07644f00595da6ebf7d603adb282f359d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?C=C3=A9dric=20Bontems?= <67456035+cbontems@users.noreply.github.com> Date: Wed, 1 Nov 2023 23:16:01 +0100 Subject: [PATCH 03/22] feat: add support for light / dark hero images (#280) Co-authored-by: Lorenzo Lewis Co-authored-by: Chris Swithinbank --- .changeset/violet-berries-mix.md | 12 ++++ .../src/content/docs/reference/frontmatter.md | 40 ++++++++--- packages/starlight/components/Hero.astro | 30 +++++--- packages/starlight/components/SiteTitle.astro | 10 +-- packages/starlight/schema.ts | 58 +-------------- packages/starlight/schemas/hero.ts | 70 +++++++++++++++++++ packages/starlight/style/util.css | 6 ++ 7 files changed, 147 insertions(+), 79 deletions(-) create mode 100644 .changeset/violet-berries-mix.md create mode 100644 packages/starlight/schemas/hero.ts diff --git a/.changeset/violet-berries-mix.md b/.changeset/violet-berries-mix.md new file mode 100644 index 0000000000..e93a59f81d --- /dev/null +++ b/.changeset/violet-berries-mix.md @@ -0,0 +1,12 @@ +--- +'@astrojs/starlight': minor +--- + +Support light & dark variants of the hero image. + +⚠️ **Potentially breaking change:** The `hero.image` schema is now slightly stricter than previously. + +The `hero.image.html` property can no longer be used alongside the `hero.image.alt` or `hero.image.file` properties. +Previously, `html` was ignored when used with `file` and `alt` was ignored when used with `html`. +Now, those combinations will throw errors. +If you encounter errors, remove the `image.hero` property that is not in use. \ No newline at end of file diff --git a/docs/src/content/docs/reference/frontmatter.md b/docs/src/content/docs/reference/frontmatter.md index 9b40138315..e1adddb5a3 100644 --- a/docs/src/content/docs/reference/frontmatter.md +++ b/docs/src/content/docs/reference/frontmatter.md @@ -111,20 +111,44 @@ hero: --- ``` +You can display different versions of the hero image in light and dark modes. + +```md +--- +hero: + image: + alt: A glittering, brightly colored logo + dark: ../../assets/logo-dark.png + light: ../../assets/logo-light.png +--- +``` + #### `HeroConfig` ```ts interface HeroConfig { title?: string; tagline?: string; - image?: { - alt?: string; - // Relative path to an image in your repository. - file?: string; - // Raw HTML to use in the image slot. - // Could be a custom `` tag or inline ``. - html?: string; - }; + image?: + | { + // Relative path to an image in your repository. + file: string; + // Alt text to make the image accessible to assistive technology + alt?: string; + } + | { + // Relative path to an image in your repository to be used for dark mode. + dark: string; + // Relative path to an image in your repository to be used for light mode. + light: string; + // Alt text to make the image accessible to assistive technology + alt?: string; + } + | { + // Raw HTML to use in the image slot. + // Could be a custom `` tag or inline ``. + html: string; + }; actions?: Array<{ text: string; link: string; diff --git a/packages/starlight/components/Hero.astro b/packages/starlight/components/Hero.astro index bd9e8202fd..f763ce227e 100644 --- a/packages/starlight/components/Hero.astro +++ b/packages/starlight/components/Hero.astro @@ -14,20 +14,34 @@ const imageAttrs = { height: 400, alt: image?.alt || '', }; + +let darkImage: ImageMetadata | undefined; +let lightImage: ImageMetadata | undefined; +let rawHtml: string | undefined; +if (image) { + if ('file' in image) { + darkImage = image.file; + } else if ('dark' in image) { + darkImage = image.dark; + lightImage = image.light; + } else { + rawHtml = image.html; + } +} ---
{ - image?.file ? ( - image.file.format === 'svg' ? ( - - ) : ( - - ) - ) : ( - image?.html &&
+ darkImage && ( + ) } + {lightImage && } + {rawHtml &&
}

diff --git a/packages/starlight/components/SiteTitle.astro b/packages/starlight/components/SiteTitle.astro index bb1c20384e..afb09c804f 100644 --- a/packages/starlight/components/SiteTitle.astro +++ b/packages/starlight/components/SiteTitle.astro @@ -12,7 +12,7 @@ const href = pathWithBase(Astro.props.locale || '/'); config.logo && logos.dark && ( <> {config.logo.alt} diff --git a/packages/starlight/schema.ts b/packages/starlight/schema.ts index 5f73dfdc59..cece594948 100644 --- a/packages/starlight/schema.ts +++ b/packages/starlight/schema.ts @@ -3,16 +3,13 @@ import type { SchemaContext } from 'astro:content'; import { HeadConfigSchema } from './schemas/head'; import { PrevNextLinkConfigSchema } from './schemas/prevNextLink'; import { TableOfContentsSchema } from './schemas/tableOfContents'; -import { Icons } from './components/Icons'; import { BadgeConfigSchema } from './schemas/badge'; +import { HeroSchema } from './schemas/hero'; import { SidebarLinkItemHTMLAttributesSchema } from './schemas/sidebar'; export { i18nSchema } from './schemas/i18n'; -type IconName = keyof typeof Icons; -const iconNames = Object.keys(Icons) as [IconName, ...IconName[]]; - export function docsSchema() { - return ({ image }: SchemaContext) => + return (context: SchemaContext) => z.object({ /** The title of the current page. Required. */ title: z.string(), @@ -45,56 +42,7 @@ export function docsSchema() { template: z.enum(['doc', 'splash']).default('doc'), /** Display a hero section on this page. */ - hero: z - .object({ - /** - * The large title text to show. If not provided, will default to the top-level `title`. - * Can include HTML. - */ - title: z.string().optional(), - /** - * A short bit of text about your project. - * Will be displayed in a smaller size below the title. - */ - tagline: z.string().optional(), - /** The image to use in the hero. You can provide either a relative `file` path or raw `html`. */ - image: z - .object({ - /** Alt text for screenreaders and other assistive technologies describing your hero image. */ - alt: z.string().default(''), - /** Relative path to an image file in your repo, e.g. `../../assets/hero.png`. */ - file: image().optional(), - /** Raw HTML string instead of an image file. Useful for inline SVGs or more complex hero content. */ - html: z.string().optional(), - }) - .optional(), - /** An array of call-to-action links displayed at the bottom of the hero. */ - actions: z - .object({ - /** Text label displayed in the link. */ - text: z.string(), - /** Value for the link’s `href` attribute, e.g. `/page` or `https://mysite.com`. */ - link: z.string(), - /** Button style to use. One of `primary`, `secondary`, or `minimal` (the default). */ - variant: z.enum(['primary', 'secondary', 'minimal']).default('minimal'), - /** - * An optional icon to display alongside the link text. - * Can be an inline `` or the name of one of Starlight’s built-in icons. - */ - icon: z - .union([z.enum(iconNames), z.string().startsWith(' { - const parsedIcon = z.enum(iconNames).safeParse(icon); - return parsedIcon.success - ? ({ type: 'icon', name: parsedIcon.data } as const) - : ({ type: 'raw', html: icon } as const); - }) - .optional(), - }) - .array() - .default([]), - }) - .optional(), + hero: HeroSchema(context).optional(), /** * The last update date of the current page. diff --git a/packages/starlight/schemas/hero.ts b/packages/starlight/schemas/hero.ts new file mode 100644 index 0000000000..e1b5611c80 --- /dev/null +++ b/packages/starlight/schemas/hero.ts @@ -0,0 +1,70 @@ +import { z } from 'astro/zod'; +import type { SchemaContext } from 'astro:content'; +import { Icons } from '../components/Icons'; + +type IconName = keyof typeof Icons; +const iconNames = Object.keys(Icons) as [IconName, ...IconName[]]; + +export const HeroSchema = ({ image }: SchemaContext) => + z.object({ + /** + * The large title text to show. If not provided, will default to the top-level `title`. + * Can include HTML. + */ + title: z.string().optional(), + /** + * A short bit of text about your project. + * Will be displayed in a smaller size below the title. + */ + tagline: z.string().optional(), + /** The image to use in the hero. You can provide either a relative `file` path or raw `html`. */ + image: z + .union([ + z.object({ + /** Alt text for screenreaders and other assistive technologies describing your hero image. */ + alt: z.string().default(''), + /** Relative path to an image file in your repo, e.g. `../../assets/hero.png`. */ + file: image(), + }), + z.object({ + /** Alt text for screenreaders and other assistive technologies describing your hero image. */ + alt: z.string().default(''), + /** Relative path to an image file in your repo to use in dark mode, e.g. `../../assets/hero-dark.png`. */ + dark: image(), + /** Relative path to an image file in your repo to use in light mode, e.g. `../../assets/hero-light.png`. */ + light: image(), + }), + z + .object({ + /** Raw HTML string instead of an image file. Useful for inline SVGs or more complex hero content. */ + html: z.string(), + }) + .transform(({ html }) => ({ html, alt: '' })), + ]) + .optional(), + /** An array of call-to-action links displayed at the bottom of the hero. */ + actions: z + .object({ + /** Text label displayed in the link. */ + text: z.string(), + /** Value for the link’s `href` attribute, e.g. `/page` or `https://mysite.com`. */ + link: z.string(), + /** Button style to use. One of `primary`, `secondary`, or `minimal` (the default). */ + variant: z.enum(['primary', 'secondary', 'minimal']).default('minimal'), + /** + * An optional icon to display alongside the link text. + * Can be an inline `` or the name of one of Starlight’s built-in icons. + */ + icon: z + .union([z.enum(iconNames), z.string().startsWith(' { + const parsedIcon = z.enum(iconNames).safeParse(icon); + return parsedIcon.success + ? ({ type: 'icon', name: parsedIcon.data } as const) + : ({ type: 'raw', html: icon } as const); + }) + .optional(), + }) + .array() + .default([]), + }); diff --git a/packages/starlight/style/util.css b/packages/starlight/style/util.css index b041a9c2f3..7486853220 100644 --- a/packages/starlight/style/util.css +++ b/packages/starlight/style/util.css @@ -41,6 +41,12 @@ display: block; } } +[data-theme='light'] .light\:sl-hidden { + display: none; +} +[data-theme='dark'] .dark\:sl-hidden { + display: none; +} /* Flip an element around the y-axis when in an RTL context. From 7f92213a0b93de5a844816841a6bc9cdd371de0c Mon Sep 17 00:00:00 2001 From: nunhes Date: Wed, 1 Nov 2023 23:17:58 +0100 Subject: [PATCH 04/22] Add Galician language support (#1004) Co-authored-by: Chris Swithinbank --- .changeset/four-pots-cheat.md | 5 +++++ docs/src/content/docs/guides/i18n.mdx | 2 +- packages/starlight/translations/gl.json | 22 ++++++++++++++++++++++ packages/starlight/translations/index.ts | 2 ++ 4 files changed, 30 insertions(+), 1 deletion(-) create mode 100644 .changeset/four-pots-cheat.md create mode 100644 packages/starlight/translations/gl.json diff --git a/.changeset/four-pots-cheat.md b/.changeset/four-pots-cheat.md new file mode 100644 index 0000000000..878c564c11 --- /dev/null +++ b/.changeset/four-pots-cheat.md @@ -0,0 +1,5 @@ +--- +"@astrojs/starlight": patch +--- + +Add Galician language support diff --git a/docs/src/content/docs/guides/i18n.mdx b/docs/src/content/docs/guides/i18n.mdx index 78acf66fb3..f86f3db035 100644 --- a/docs/src/content/docs/guides/i18n.mdx +++ b/docs/src/content/docs/guides/i18n.mdx @@ -143,7 +143,7 @@ If a translation is not yet available for a language, Starlight will show reader In addition to hosting translated content files, Starlight allows you to translate the default UI strings (e.g. the "On this page" heading in the table of contents) so that your readers can experience your site entirely in the selected language. -English, Czech, French, German, Italian, Japanese, Portuguese, Dutch, Danish, Spanish, Turkish, Arabic, Norwegian, Farsi, Hebrew, Simplified Chinese, Korean, Indonesian, Russian, Swedish, Ukrainian, and Vietnamese translated UI strings are provided out of the box, and we welcome [contributions to add more default languages](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md). +English, Czech, French, German, Italian, Japanese, Portuguese, Dutch, Danish, Spanish, Turkish, Arabic, Norwegian, Farsi, Hebrew, Simplified Chinese, Korean, Indonesian, Russian, Swedish, Ukrainian, Vietnamese, and Galician translated UI strings are provided out of the box, and we welcome [contributions to add more default languages](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md). You can provide translations for additional languages you support — or override our default labels — via the `i18n` data collection. diff --git a/packages/starlight/translations/gl.json b/packages/starlight/translations/gl.json new file mode 100644 index 0000000000..9b9d1401b6 --- /dev/null +++ b/packages/starlight/translations/gl.json @@ -0,0 +1,22 @@ +{ + "skipLink.label": "Ir ao contido", + "search.label": "Busca", + "search.shortcutLabel": "(Preme / para Busca)", + "search.cancelLabel": "Deixar", + "search.devWarning": "A busca só está dispoñible nas versións de producción. \nTrata de construir e ollear o sitio para probalo localmente.", + "themeSelect.accessibleLabel": "Seleciona tema", + "themeSelect.dark": "Escuro", + "themeSelect.light": "Claro", + "themeSelect.auto": "Auto", + "languageSelect.accessibleLabel": "Seleciona linguaxe", + "menuButton.accessibleLabel": "Menú", + "sidebarNav.accessibleLabel": "Principal", + "tableOfContents.onThisPage": "Nesta paxina", + "tableOfContents.overview": "Sinopse", + "i18n.untranslatedContent": "Este contido aínda non está dispoñible no teu idioma.", + "page.editLink": "Editar paxina", + "page.lastUpdated": "Última actualización:", + "page.previousLink": "Anterior", + "page.nextLink": "Seguinte", + "404.text": "Paxina non atopada. Comproba a URL ou intenta usar a barra de busca." + } diff --git a/packages/starlight/translations/index.ts b/packages/starlight/translations/index.ts index 52c82d1fe8..92cc73dbd4 100644 --- a/packages/starlight/translations/index.ts +++ b/packages/starlight/translations/index.ts @@ -7,6 +7,7 @@ import ja from './ja.json'; import pt from './pt.json'; import fa from './fa.json'; import fr from './fr.json'; +import gl from './gl.json'; import he from './he.json'; import id from './id.json'; import it from './it.json'; @@ -34,6 +35,7 @@ export default Object.fromEntries( pt, fa, fr, + gl, he, id, it, From 92103b9cf448d190f06e4865167c65f085c4b86a Mon Sep 17 00:00:00 2001 From: delucis Date: Wed, 1 Nov 2023 22:18:37 +0000 Subject: [PATCH 05/22] [ci] format --- packages/starlight/translations/gl.json | 42 ++++++++++++------------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/packages/starlight/translations/gl.json b/packages/starlight/translations/gl.json index 9b9d1401b6..c184338d02 100644 --- a/packages/starlight/translations/gl.json +++ b/packages/starlight/translations/gl.json @@ -1,22 +1,22 @@ { - "skipLink.label": "Ir ao contido", - "search.label": "Busca", - "search.shortcutLabel": "(Preme / para Busca)", - "search.cancelLabel": "Deixar", - "search.devWarning": "A busca só está dispoñible nas versións de producción. \nTrata de construir e ollear o sitio para probalo localmente.", - "themeSelect.accessibleLabel": "Seleciona tema", - "themeSelect.dark": "Escuro", - "themeSelect.light": "Claro", - "themeSelect.auto": "Auto", - "languageSelect.accessibleLabel": "Seleciona linguaxe", - "menuButton.accessibleLabel": "Menú", - "sidebarNav.accessibleLabel": "Principal", - "tableOfContents.onThisPage": "Nesta paxina", - "tableOfContents.overview": "Sinopse", - "i18n.untranslatedContent": "Este contido aínda non está dispoñible no teu idioma.", - "page.editLink": "Editar paxina", - "page.lastUpdated": "Última actualización:", - "page.previousLink": "Anterior", - "page.nextLink": "Seguinte", - "404.text": "Paxina non atopada. Comproba a URL ou intenta usar a barra de busca." - } + "skipLink.label": "Ir ao contido", + "search.label": "Busca", + "search.shortcutLabel": "(Preme / para Busca)", + "search.cancelLabel": "Deixar", + "search.devWarning": "A busca só está dispoñible nas versións de producción. \nTrata de construir e ollear o sitio para probalo localmente.", + "themeSelect.accessibleLabel": "Seleciona tema", + "themeSelect.dark": "Escuro", + "themeSelect.light": "Claro", + "themeSelect.auto": "Auto", + "languageSelect.accessibleLabel": "Seleciona linguaxe", + "menuButton.accessibleLabel": "Menú", + "sidebarNav.accessibleLabel": "Principal", + "tableOfContents.onThisPage": "Nesta paxina", + "tableOfContents.overview": "Sinopse", + "i18n.untranslatedContent": "Este contido aínda non está dispoñible no teu idioma.", + "page.editLink": "Editar paxina", + "page.lastUpdated": "Última actualización:", + "page.previousLink": "Anterior", + "page.nextLink": "Seguinte", + "404.text": "Paxina non atopada. Comproba a URL ou intenta usar a barra de busca." +} From 977fe135a74661300589898abe98aec73cad9ed3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20G=C3=B3mez-S=C3=A1nchez?= <7352559+magicDGS@users.noreply.github.com> Date: Wed, 1 Nov 2023 23:28:38 +0100 Subject: [PATCH 06/22] Add social icons to mobile menu footer (#988) Co-authored-by: Chris Swithinbank --- .changeset/swift-geckos-remain.md | 5 +++++ .../starlight/components/MobileMenuFooter.astro | 16 +++++++++++++++- 2 files changed, 20 insertions(+), 1 deletion(-) create mode 100644 .changeset/swift-geckos-remain.md diff --git a/.changeset/swift-geckos-remain.md b/.changeset/swift-geckos-remain.md new file mode 100644 index 0000000000..6121935cf5 --- /dev/null +++ b/.changeset/swift-geckos-remain.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': minor +--- + +Include social icon links in mobile menu diff --git a/packages/starlight/components/MobileMenuFooter.astro b/packages/starlight/components/MobileMenuFooter.astro index a5258da170..b1a3094c73 100644 --- a/packages/starlight/components/MobileMenuFooter.astro +++ b/packages/starlight/components/MobileMenuFooter.astro @@ -1,17 +1,31 @@ --- -import { LanguageSelect, ThemeSelect } from 'virtual:starlight/components'; +import { LanguageSelect, ThemeSelect, SocialIcons } from 'virtual:starlight/components'; import type { Props } from '../props'; ---
+
From f1fdb50daebe79548c7789d3f7dd968b261d2da7 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Wed, 1 Nov 2023 23:31:53 +0100 Subject: [PATCH 07/22] Refactor translation system to be reusable in non-Astro code (#1003) --- .changeset/large-squids-wash.md | 5 ++ .../i18n/empty-src/content/i18n/.gitkeep | 0 .../i18n/malformed-src/content/i18n/en.json | 3 + .../__tests__/i18n/src/content/i18n/en.json | 3 + .../__tests__/i18n/translations-fs.test.ts | 76 ++++++++++++++++++ packages/starlight/index.ts | 2 + packages/starlight/schemas/i18n.ts | 1 + .../utils/createTranslationSystem.ts | 79 +++++++++++++++++++ packages/starlight/utils/translations-fs.ts | 44 +++++++++++ packages/starlight/utils/translations.ts | 58 ++------------ 10 files changed, 218 insertions(+), 53 deletions(-) create mode 100644 .changeset/large-squids-wash.md create mode 100644 packages/starlight/__tests__/i18n/empty-src/content/i18n/.gitkeep create mode 100644 packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json create mode 100644 packages/starlight/__tests__/i18n/src/content/i18n/en.json create mode 100644 packages/starlight/__tests__/i18n/translations-fs.test.ts create mode 100644 packages/starlight/utils/createTranslationSystem.ts create mode 100644 packages/starlight/utils/translations-fs.ts diff --git a/.changeset/large-squids-wash.md b/.changeset/large-squids-wash.md new file mode 100644 index 0000000000..924b70dc82 --- /dev/null +++ b/.changeset/large-squids-wash.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': patch +--- + +Internal: refactor translation string loading to make translations available to Starlight integration code diff --git a/packages/starlight/__tests__/i18n/empty-src/content/i18n/.gitkeep b/packages/starlight/__tests__/i18n/empty-src/content/i18n/.gitkeep new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json b/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json new file mode 100644 index 0000000000..6c91695579 --- /dev/null +++ b/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json @@ -0,0 +1,3 @@ +{ +, +} diff --git a/packages/starlight/__tests__/i18n/src/content/i18n/en.json b/packages/starlight/__tests__/i18n/src/content/i18n/en.json new file mode 100644 index 0000000000..099e4c00f8 --- /dev/null +++ b/packages/starlight/__tests__/i18n/src/content/i18n/en.json @@ -0,0 +1,3 @@ +{ + "page.editLink": "Make this page different" +} diff --git a/packages/starlight/__tests__/i18n/translations-fs.test.ts b/packages/starlight/__tests__/i18n/translations-fs.test.ts new file mode 100644 index 0000000000..5b9025aa95 --- /dev/null +++ b/packages/starlight/__tests__/i18n/translations-fs.test.ts @@ -0,0 +1,76 @@ +import { describe, expect, test } from 'vitest'; +import { createTranslationSystemFromFs } from '../../utils/translations-fs'; + +describe('createTranslationSystemFromFs', () => { + test('creates a translation system that returns default strings', () => { + const useTranslations = createTranslationSystemFromFs( + { + locales: { en: { label: 'English', dir: 'ltr' } }, + defaultLocale: { label: 'English', locale: 'en', dir: 'ltr' }, + }, + // Using non-existent `_src/` to ignore custom files in this test fixture. + { srcDir: new URL('./_src/', import.meta.url) } + ); + const t = useTranslations('en'); + expect(t('page.editLink')).toMatchInlineSnapshot('"Edit page"'); + }); + + test('creates a translation system that uses custom strings', () => { + const useTranslations = createTranslationSystemFromFs( + { + locales: { en: { label: 'English', dir: 'ltr' } }, + defaultLocale: { label: 'English', locale: 'en', dir: 'ltr' }, + }, + // Using `src/` to load custom files in this test fixture. + { srcDir: new URL('./src/', import.meta.url) } + ); + const t = useTranslations('en'); + expect(t('page.editLink')).toMatchInlineSnapshot('"Make this page different"'); + }); + + test('supports root locale', () => { + const useTranslations = createTranslationSystemFromFs( + { + locales: { root: { label: 'English', dir: 'ltr', lang: 'en' } }, + defaultLocale: { label: 'English', locale: 'root', lang: 'en', dir: 'ltr' }, + }, + // Using `src/` to load custom files in this test fixture. + { srcDir: new URL('./src/', import.meta.url) } + ); + const t = useTranslations(undefined); + expect(t('page.editLink')).toMatchInlineSnapshot('"Make this page different"'); + }); + + test('returns translation for unknown language', () => { + const useTranslations = createTranslationSystemFromFs( + { + locales: { root: { label: 'English', dir: 'ltr', lang: 'en' } }, + defaultLocale: { label: 'English', locale: undefined, dir: 'ltr' }, + }, + // Using `src/` to load custom files in this test fixture. + { srcDir: new URL('./src/', import.meta.url) } + ); + const t = useTranslations('fr'); + expect(t('page.editLink')).toMatchInlineSnapshot('"Make this page different"'); + }); + + test('handles empty i18n directory', () => { + const useTranslations = createTranslationSystemFromFs( + { locales: {}, defaultLocale: { label: 'English', locale: 'en', dir: 'ltr' } }, + // Using `empty-src/` to emulate empty `src/content/i18n/` directory. + { srcDir: new URL('./empty-src/', import.meta.url) } + ); + const t = useTranslations('en'); + expect(t('page.editLink')).toMatchInlineSnapshot('"Edit page"'); + }); + + test('throws on malformed i18n JSON', () => { + expect(() => + createTranslationSystemFromFs( + { locales: {}, defaultLocale: { label: 'English', locale: 'en', dir: 'ltr' } }, + // Using `malformed-src/` to trigger syntax error in bad JSON file. + { srcDir: new URL('./malformed-src/', import.meta.url) } + ) + ).toThrow(SyntaxError); + }); +}); diff --git a/packages/starlight/index.ts b/packages/starlight/index.ts index a52b994f20..53ffb2e20c 100644 --- a/packages/starlight/index.ts +++ b/packages/starlight/index.ts @@ -9,6 +9,7 @@ import { vitePluginStarlightUserConfig } from './integrations/virtual-user-confi import { errorMap } from './utils/error-map'; import { StarlightConfigSchema, type StarlightUserConfig } from './utils/user-config'; import { rehypeRtlCodeSupport } from './integrations/code-rtl-support'; +import { createTranslationSystemFromFs } from './utils/translations-fs'; export default function StarlightIntegration(opts: StarlightUserConfig): AstroIntegration { const parsedConfig = StarlightConfigSchema.safeParse(opts, { errorMap }); @@ -26,6 +27,7 @@ export default function StarlightIntegration(opts: StarlightUserConfig): AstroIn name: '@astrojs/starlight', hooks: { 'astro:config:setup': ({ config, injectRoute, updateConfig }) => { + const useTranslations = createTranslationSystemFromFs(userConfig, config); injectRoute({ pattern: '404', entryPoint: '@astrojs/starlight/404.astro', diff --git a/packages/starlight/schemas/i18n.ts b/packages/starlight/schemas/i18n.ts index 070034128c..eb26304d05 100644 --- a/packages/starlight/schemas/i18n.ts +++ b/packages/starlight/schemas/i18n.ts @@ -3,6 +3,7 @@ import { z } from 'astro/zod'; export function i18nSchema() { return starlightI18nSchema().merge(pagefindI18nSchema()); } +export type i18nSchemaOutput = z.output>; export function builtinI18nSchema() { return starlightI18nSchema().required().strict().merge(pagefindI18nSchema()); diff --git a/packages/starlight/utils/createTranslationSystem.ts b/packages/starlight/utils/createTranslationSystem.ts new file mode 100644 index 0000000000..97a79e3a52 --- /dev/null +++ b/packages/starlight/utils/createTranslationSystem.ts @@ -0,0 +1,79 @@ +import type { i18nSchemaOutput } from '../schemas/i18n'; +import builtinTranslations from '../translations'; +import type { StarlightConfig } from './user-config'; + +export function createTranslationSystem( + userTranslations: Record, + config: Pick +) { + /** User-configured default locale. */ + const defaultLocale = config.defaultLocale?.locale || 'root'; + + /** Default map of UI strings based on Starlight and user-configured defaults. */ + const defaults = buildDictionary( + builtinTranslations.en!, + userTranslations.en, + builtinTranslations[defaultLocale] || builtinTranslations[stripLangRegion(defaultLocale)], + userTranslations[defaultLocale] + ); + + /** + * Generate a utility function that returns UI strings for the given `locale`. + * @param {string | undefined} [locale] + * @example + * const t = useTranslations('en'); + * const label = t('search.label'); // => 'Search' + */ + return function useTranslations(locale: string | undefined) { + const lang = localeToLang(locale, config.locales, config.defaultLocale); + const dictionary = buildDictionary( + defaults, + builtinTranslations[lang] || builtinTranslations[stripLangRegion(lang)], + userTranslations[lang] + ); + const t = (key: K) => dictionary[key]; + t.pick = (startOfKey: string) => + Object.fromEntries(Object.entries(dictionary).filter(([k]) => k.startsWith(startOfKey))); + return t; + }; +} + +/** + * Strips the region subtag from a BCP-47 lang string. + * @param {string} [lang] + * @example + * const lang = stripLangRegion('en-GB'); // => 'en' + */ +function stripLangRegion(lang: string) { + return lang.replace(/-[a-zA-Z]{2}/, ''); +} + +/** + * Get the BCP-47 language tag for the given locale. + * @param locale Locale string or `undefined` for the root locale. + */ +function localeToLang( + locale: string | undefined, + locales: StarlightConfig['locales'], + defaultLocale: StarlightConfig['defaultLocale'] +): string { + const lang = locale ? locales?.[locale]?.lang : locales?.root?.lang; + const defaultLang = defaultLocale?.lang || defaultLocale?.locale; + return lang || defaultLang || 'en'; +} + +/** Build a dictionary by layering preferred translation sources. */ +function buildDictionary( + base: (typeof builtinTranslations)[string], + ...dictionaries: (i18nSchemaOutput | undefined)[] +) { + const dictionary = { ...base }; + // Iterate over alternate dictionaries to avoid overwriting preceding values with `undefined`. + for (const dict of dictionaries) { + for (const key in dict) { + const value = dict[key as keyof typeof dict]; + if (value) dictionary[key as keyof typeof dict] = value; + } + } + return dictionary; +} diff --git a/packages/starlight/utils/translations-fs.ts b/packages/starlight/utils/translations-fs.ts new file mode 100644 index 0000000000..d218f19eae --- /dev/null +++ b/packages/starlight/utils/translations-fs.ts @@ -0,0 +1,44 @@ +import fs from 'node:fs'; +import type { i18nSchemaOutput } from '../schemas/i18n'; +import { createTranslationSystem } from './createTranslationSystem'; +import type { StarlightConfig } from './user-config'; +import type { AstroConfig } from 'astro'; + +/** + * Loads and creates a translation system from the file system. + * Only for use in integration code. + * In modules loaded by Vite/Astro, import [`useTranslations`](./translations.ts) instead. + * + * @see [`./translations.ts`](./translations.ts) + */ +export function createTranslationSystemFromFs( + opts: Pick, + { srcDir }: Pick +) { + /** All translation data from the i18n collection, keyed by `id`, which matches locale. */ + let userTranslations: Record = {}; + try { + const i18nDir = new URL('content/i18n/', srcDir); + // Load the user’s i18n directory + const files = fs.readdirSync(i18nDir, 'utf-8'); + // Load the user’s i18n collection and ignore the error if it doesn’t exist. + userTranslations = Object.fromEntries( + files + .filter((file) => file.endsWith('.json')) + .map((file) => { + const id = file.slice(0, -5); + const data = JSON.parse(fs.readFileSync(new URL(file, i18nDir), 'utf-8')); + return [id, data] as const; + }) + ); + } catch (e: unknown) { + if (e instanceof Error && 'code' in e && e.code === 'ENOENT') { + // i18nDir doesn’t exist, so we ignore the error. + } else { + // Other errors may be meaningful, e.g. JSON syntax errors, so should be thrown. + throw e; + } + } + + return createTranslationSystem(userTranslations, opts); +} diff --git a/packages/starlight/utils/translations.ts b/packages/starlight/utils/translations.ts index b4c6da4b64..1dbc856137 100644 --- a/packages/starlight/utils/translations.ts +++ b/packages/starlight/utils/translations.ts @@ -1,13 +1,10 @@ -import { type CollectionEntry, getCollection } from 'astro:content'; +import { getCollection } from 'astro:content'; import config from 'virtual:starlight/user-config'; -import builtinTranslations from '../translations'; -import { localeToLang } from './slugs'; - -/** User-configured default locale. */ -const defaultLocale = config.defaultLocale?.locale || 'root'; +import type { i18nSchemaOutput } from '../schemas/i18n'; +import { createTranslationSystem } from './createTranslationSystem'; /** All translation data from the i18n collection, keyed by `id`, which matches locale. */ -let userTranslations: Record['data']> = {}; +let userTranslations: Record = {}; try { // Load the user’s i18n collection and ignore the error if it doesn’t exist. userTranslations = Object.fromEntries( @@ -15,24 +12,6 @@ try { ); } catch {} -/** Default map of UI strings based on Starlight and user-configured defaults. */ -const defaults = buildDictionary( - builtinTranslations.en!, - userTranslations.en, - builtinTranslations[defaultLocale] || builtinTranslations[stripLangRegion(defaultLocale)], - userTranslations[defaultLocale] -); - -/** - * Strips the region subtag from a BCP-47 lang string. - * @param {string} [lang] - * @example - * const lang = stripLangRegion('en-GB'); // => 'en' - */ -export function stripLangRegion(lang: string) { - return lang.replace(/-[a-zA-Z]{2}/, ''); -} - /** * Generate a utility function that returns UI strings for the given `locale`. * @param {string | undefined} [locale] @@ -40,31 +19,4 @@ export function stripLangRegion(lang: string) { * const t = useTranslations('en'); * const label = t('search.label'); // => 'Search' */ -export function useTranslations(locale: string | undefined) { - const lang = localeToLang(locale); - const dictionary = buildDictionary( - defaults, - builtinTranslations[lang] || builtinTranslations[stripLangRegion(lang)], - userTranslations[lang] - ); - const t = (key: K) => dictionary[key]; - t.pick = (startOfKey: string) => - Object.fromEntries(Object.entries(dictionary).filter(([k]) => k.startsWith(startOfKey))); - return t; -} - -/** Build a dictionary by layering preferred translation sources. */ -function buildDictionary( - base: (typeof builtinTranslations)[string], - ...dictionaries: (CollectionEntry<'i18n'>['data'] | undefined)[] -) { - const dictionary = { ...base }; - // Iterate over alternate dictionaries to avoid overwriting preceding values with `undefined`. - for (const dict of dictionaries) { - for (const key in dict) { - const value = dict[key as keyof typeof dict]; - if (value) dictionary[key as keyof typeof dict] = value; - } - } - return dictionary; -} +export const useTranslations = createTranslationSystem(userTranslations, config); From 72e2f2c3a23fd8fc19cd5ca31b3a592f6e5f304a Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Wed, 1 Nov 2023 23:37:18 +0100 Subject: [PATCH 08/22] Fix Prettier-compatibility of i18n test fixture --- .../__tests__/i18n/malformed-src/content/i18n/en.json | 3 --- 1 file changed, 3 deletions(-) diff --git a/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json b/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json index 6c91695579..e69de29bb2 100644 --- a/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json +++ b/packages/starlight/__tests__/i18n/malformed-src/content/i18n/en.json @@ -1,3 +0,0 @@ -{ -, -} From 00cd951a8d9bc338b93854c93f99693388978a26 Mon Sep 17 00:00:00 2001 From: "Houston (Bot)" <108291165+astrobot-houston@users.noreply.github.com> Date: Wed, 1 Nov 2023 15:42:25 -0700 Subject: [PATCH 09/22] [ci] release (#996) Co-authored-by: github-actions[bot] --- .changeset/four-pots-cheat.md | 5 ---- .changeset/large-squids-wash.md | 5 ---- .changeset/orange-pants-tell.md | 5 ---- .changeset/swift-geckos-remain.md | 5 ---- .changeset/thick-bats-pay.md | 5 ---- .changeset/violet-berries-mix.md | 12 --------- examples/basics/package.json | 2 +- examples/tailwind/package.json | 4 +-- packages/starlight/CHANGELOG.md | 41 ++++++++++++++++++++++++------- packages/starlight/package.json | 2 +- packages/tailwind/CHANGELOG.md | 6 +++++ packages/tailwind/package.json | 2 +- pnpm-lock.yaml | 6 ++--- 13 files changed, 46 insertions(+), 54 deletions(-) delete mode 100644 .changeset/four-pots-cheat.md delete mode 100644 .changeset/large-squids-wash.md delete mode 100644 .changeset/orange-pants-tell.md delete mode 100644 .changeset/swift-geckos-remain.md delete mode 100644 .changeset/thick-bats-pay.md delete mode 100644 .changeset/violet-berries-mix.md diff --git a/.changeset/four-pots-cheat.md b/.changeset/four-pots-cheat.md deleted file mode 100644 index 878c564c11..0000000000 --- a/.changeset/four-pots-cheat.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@astrojs/starlight": patch ---- - -Add Galician language support diff --git a/.changeset/large-squids-wash.md b/.changeset/large-squids-wash.md deleted file mode 100644 index 924b70dc82..0000000000 --- a/.changeset/large-squids-wash.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@astrojs/starlight': patch ---- - -Internal: refactor translation string loading to make translations available to Starlight integration code diff --git a/.changeset/orange-pants-tell.md b/.changeset/orange-pants-tell.md deleted file mode 100644 index a11ff966b7..0000000000 --- a/.changeset/orange-pants-tell.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@astrojs/starlight': minor ---- - -Adds support for adding sidebar badges to group headings diff --git a/.changeset/swift-geckos-remain.md b/.changeset/swift-geckos-remain.md deleted file mode 100644 index 6121935cf5..0000000000 --- a/.changeset/swift-geckos-remain.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@astrojs/starlight': minor ---- - -Include social icon links in mobile menu diff --git a/.changeset/thick-bats-pay.md b/.changeset/thick-bats-pay.md deleted file mode 100644 index 65987f72c9..0000000000 --- a/.changeset/thick-bats-pay.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@astrojs/starlight-tailwind': patch ---- - -Show `tailwind.config.mjs` file in docs diff --git a/.changeset/violet-berries-mix.md b/.changeset/violet-berries-mix.md deleted file mode 100644 index e93a59f81d..0000000000 --- a/.changeset/violet-berries-mix.md +++ /dev/null @@ -1,12 +0,0 @@ ---- -'@astrojs/starlight': minor ---- - -Support light & dark variants of the hero image. - -⚠️ **Potentially breaking change:** The `hero.image` schema is now slightly stricter than previously. - -The `hero.image.html` property can no longer be used alongside the `hero.image.alt` or `hero.image.file` properties. -Previously, `html` was ignored when used with `file` and `alt` was ignored when used with `html`. -Now, those combinations will throw errors. -If you encounter errors, remove the `image.hero` property that is not in use. \ No newline at end of file diff --git a/examples/basics/package.json b/examples/basics/package.json index ff6fba7285..b7a528788f 100644 --- a/examples/basics/package.json +++ b/examples/basics/package.json @@ -11,7 +11,7 @@ "astro": "astro" }, "dependencies": { - "@astrojs/starlight": "^0.11.2", + "@astrojs/starlight": "^0.12.0", "astro": "^3.2.3", "sharp": "^0.32.5" } diff --git a/examples/tailwind/package.json b/examples/tailwind/package.json index 82f4db1f66..25851c5600 100644 --- a/examples/tailwind/package.json +++ b/examples/tailwind/package.json @@ -11,8 +11,8 @@ "astro": "astro" }, "dependencies": { - "@astrojs/starlight": "^0.11.2", - "@astrojs/starlight-tailwind": "^2.0.0", + "@astrojs/starlight": "^0.12.0", + "@astrojs/starlight-tailwind": "^2.0.1", "@astrojs/tailwind": "^5.0.0", "astro": "^3.2.3", "sharp": "^0.32.5", diff --git a/packages/starlight/CHANGELOG.md b/packages/starlight/CHANGELOG.md index 4d72631f70..b1efb6fc21 100644 --- a/packages/starlight/CHANGELOG.md +++ b/packages/starlight/CHANGELOG.md @@ -1,5 +1,28 @@ # @astrojs/starlight +## 0.12.0 + +### Minor Changes + +- [#995](https://github.com/withastro/starlight/pull/995) [`5bf4457`](https://github.com/withastro/starlight/commit/5bf44577634935b9fa6d50b040abcd680035075f) Thanks [@kevinzunigacuellar](https://github.com/kevinzunigacuellar)! - Adds support for adding sidebar badges to group headings + +- [#988](https://github.com/withastro/starlight/pull/988) [`977fe13`](https://github.com/withastro/starlight/commit/977fe135a74661300589898abe98aec73cad9ed3) Thanks [@magicDGS](https://github.com/magicDGS)! - Include social icon links in mobile menu + +- [#280](https://github.com/withastro/starlight/pull/280) [`72cca2d`](https://github.com/withastro/starlight/commit/72cca2d07644f00595da6ebf7d603adb282f359d) Thanks [@cbontems](https://github.com/cbontems)! - Support light & dark variants of the hero image. + + ⚠️ **Potentially breaking change:** The `hero.image` schema is now slightly stricter than previously. + + The `hero.image.html` property can no longer be used alongside the `hero.image.alt` or `hero.image.file` properties. + Previously, `html` was ignored when used with `file` and `alt` was ignored when used with `html`. + Now, those combinations will throw errors. + If you encounter errors, remove the `image.hero` property that is not in use. + +### Patch Changes + +- [#1004](https://github.com/withastro/starlight/pull/1004) [`7f92213`](https://github.com/withastro/starlight/commit/7f92213a0b93de5a844816841a6bc9cdd371de0c) Thanks [@nunhes](https://github.com/nunhes)! - Add Galician language support + +- [#1003](https://github.com/withastro/starlight/pull/1003) [`f1fdb50`](https://github.com/withastro/starlight/commit/f1fdb50daebe79548c7789d3f7dd968b261d2da7) Thanks [@delucis](https://github.com/delucis)! - Internal: refactor translation string loading to make translations available to Starlight integration code + ## 0.11.2 ### Patch Changes @@ -258,16 +281,16 @@ ```css :root { - --sl-hue-accent: 234; - --sl-color-accent-low: hsl(var(--sl-hue-accent), 54%, 20%); - --sl-color-accent: hsl(var(--sl-hue-accent), 100%, 60%); - --sl-color-accent-high: hsl(var(--sl-hue-accent), 100%, 87%); + --sl-hue-accent: 234; + --sl-color-accent-low: hsl(var(--sl-hue-accent), 54%, 20%); + --sl-color-accent: hsl(var(--sl-hue-accent), 100%, 60%); + --sl-color-accent-high: hsl(var(--sl-hue-accent), 100%, 87%); } :root[data-theme='light'] { - --sl-color-accent-high: hsl(var(--sl-hue-accent), 80%, 30%); - --sl-color-accent: hsl(var(--sl-hue-accent), 90%, 60%); - --sl-color-accent-low: hsl(var(--sl-hue-accent), 88%, 90%); + --sl-color-accent-high: hsl(var(--sl-hue-accent), 80%, 30%); + --sl-color-accent: hsl(var(--sl-hue-accent), 90%, 60%); + --sl-color-accent-low: hsl(var(--sl-hue-accent), 88%, 90%); } ``` @@ -646,8 +669,8 @@ ```json { - "search.label": "Suchen", - "search.shortcutLabel": "(Drücke / zum Suchen)" + "search.label": "Suchen", + "search.shortcutLabel": "(Drücke / zum Suchen)" } ``` diff --git a/packages/starlight/package.json b/packages/starlight/package.json index ccae14c4d5..946dc1eb4d 100644 --- a/packages/starlight/package.json +++ b/packages/starlight/package.json @@ -1,6 +1,6 @@ { "name": "@astrojs/starlight", - "version": "0.11.2", + "version": "0.12.0", "description": "Build beautiful, high-performance documentation websites with Astro", "scripts": { "test": "vitest", diff --git a/packages/tailwind/CHANGELOG.md b/packages/tailwind/CHANGELOG.md index bf0340e35b..6f7d6f99f1 100644 --- a/packages/tailwind/CHANGELOG.md +++ b/packages/tailwind/CHANGELOG.md @@ -1,5 +1,11 @@ # @astrojs/starlight-tailwind +## 2.0.1 + +### Patch Changes + +- [#903](https://github.com/withastro/starlight/pull/903) [`232f512`](https://github.com/withastro/starlight/commit/232f51207fe97880760fba25351cdc65b20f4c67) Thanks [@torn4dom4n](https://github.com/torn4dom4n)! - Show `tailwind.config.mjs` file in docs + ## 2.0.0 ### Major Changes diff --git a/packages/tailwind/package.json b/packages/tailwind/package.json index d7496c524e..9a7d056888 100644 --- a/packages/tailwind/package.json +++ b/packages/tailwind/package.json @@ -1,6 +1,6 @@ { "name": "@astrojs/starlight-tailwind", - "version": "2.0.0", + "version": "2.0.1", "description": "Tailwind CSS plugin for the Starlight documentation theme for Astro", "author": "Chris Swithinbank ", "license": "MIT", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f4afdf5479..c603574136 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -103,7 +103,7 @@ importers: examples/basics: dependencies: '@astrojs/starlight': - specifier: ^0.11.2 + specifier: ^0.12.0 version: link:../../packages/starlight astro: specifier: ^3.2.3 @@ -115,10 +115,10 @@ importers: examples/tailwind: dependencies: '@astrojs/starlight': - specifier: ^0.11.2 + specifier: ^0.12.0 version: link:../../packages/starlight '@astrojs/starlight-tailwind': - specifier: ^2.0.0 + specifier: ^2.0.1 version: link:../../packages/tailwind '@astrojs/tailwind': specifier: ^5.0.0 From 8f7a0efc2d47a7564870b9b8b0ef5bc923f4a5c5 Mon Sep 17 00:00:00 2001 From: delucis Date: Wed, 1 Nov 2023 22:43:24 +0000 Subject: [PATCH 10/22] [ci] format --- packages/starlight/CHANGELOG.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/starlight/CHANGELOG.md b/packages/starlight/CHANGELOG.md index b1efb6fc21..901e1a813c 100644 --- a/packages/starlight/CHANGELOG.md +++ b/packages/starlight/CHANGELOG.md @@ -281,16 +281,16 @@ ```css :root { - --sl-hue-accent: 234; - --sl-color-accent-low: hsl(var(--sl-hue-accent), 54%, 20%); - --sl-color-accent: hsl(var(--sl-hue-accent), 100%, 60%); - --sl-color-accent-high: hsl(var(--sl-hue-accent), 100%, 87%); + --sl-hue-accent: 234; + --sl-color-accent-low: hsl(var(--sl-hue-accent), 54%, 20%); + --sl-color-accent: hsl(var(--sl-hue-accent), 100%, 60%); + --sl-color-accent-high: hsl(var(--sl-hue-accent), 100%, 87%); } :root[data-theme='light'] { - --sl-color-accent-high: hsl(var(--sl-hue-accent), 80%, 30%); - --sl-color-accent: hsl(var(--sl-hue-accent), 90%, 60%); - --sl-color-accent-low: hsl(var(--sl-hue-accent), 88%, 90%); + --sl-color-accent-high: hsl(var(--sl-hue-accent), 80%, 30%); + --sl-color-accent: hsl(var(--sl-hue-accent), 90%, 60%); + --sl-color-accent-low: hsl(var(--sl-hue-accent), 88%, 90%); } ``` @@ -669,8 +669,8 @@ ```json { - "search.label": "Suchen", - "search.shortcutLabel": "(Drücke / zum Suchen)" + "search.label": "Suchen", + "search.shortcutLabel": "(Drücke / zum Suchen)" } ``` From f59e37a78b3859ebf4d39afcb3f62dfddfbf67f1 Mon Sep 17 00:00:00 2001 From: Vitor Ayres Date: Thu, 2 Nov 2023 06:09:42 -0300 Subject: [PATCH 11/22] i18n(pt-BR): Update `css-and-tailwind.mdx`, `authoring-content.md` and `overrides.md` (#1009) Co-authored-by: HiDeoo <494699+HiDeoo@users.noreply.github.com> --- .../docs/pt-br/guides/authoring-content.md | 4 ++++ .../docs/pt-br/guides/css-and-tailwind.mdx | 16 ++++++++-------- .../content/docs/pt-br/reference/overrides.md | 2 +- 3 files changed, 13 insertions(+), 9 deletions(-) diff --git a/docs/src/content/docs/pt-br/guides/authoring-content.md b/docs/src/content/docs/pt-br/guides/authoring-content.md index 831b2e4897..256ec2a062 100644 --- a/docs/src/content/docs/pt-br/guides/authoring-content.md +++ b/docs/src/content/docs/pt-br/guides/authoring-content.md @@ -207,3 +207,7 @@ Longos blocos de código de linha única não devem quebrar linha. Eles devem ro ## Outras funcionalidades comuns do Markdown Starlight suporta todo o resto da sintaxe de escrita do Markdown, como listas e tabelas. Veja a [Cheat Sheet de Markdown do The Markdown Guide](https://www.markdownguide.org/cheat-sheet/) para uma visão geral rápida de todos os elementos da sintaxe do Markdown. + +## Markdown Avançado e Configurando MDX + +O Starlight utiliza o mesmo rendizador Markdown e MDX do Astro, que suporta remark e rehype. Você pode adicionar sintaxe e comportamento personalizado adicionando `remarkPlugins` ou `rehypePlugins` no seu arquivo de configuração Astro. Visite [Configurando Markdown e MDX](https://docs.astro.build/pt-br/guides/markdown-content/#configurando-markdown-e-mdx) na documentação do Astro para saber mais. \ No newline at end of file diff --git a/docs/src/content/docs/pt-br/guides/css-and-tailwind.mdx b/docs/src/content/docs/pt-br/guides/css-and-tailwind.mdx index bb71b2e5cb..cbe74760c2 100644 --- a/docs/src/content/docs/pt-br/guides/css-and-tailwind.mdx +++ b/docs/src/content/docs/pt-br/guides/css-and-tailwind.mdx @@ -181,14 +181,14 @@ Se você já tem um site Starlight e quer adicionar Tailwind CSS, siga estes pas }); ``` -5. Adicione o plugin Starlight Tailwind em `tailwind.config.cjs`: +5. Adicione o plugin Starlight Tailwind em `tailwind.config.mjs`: ```js ins={2,7} - // tailwind.config.cjs - const starlightPlugin = require('@astrojs/starlight-tailwind'); + // tailwind.config.mjs + import starlightPlugin from '@astrojs/starlight-tailwind'; /** @type {import('tailwindcss').Config} */ - module.exports = { + export default { content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], plugins: [starlightPlugin()], }; @@ -206,12 +206,12 @@ Se definidas, as seguintes opções irão sobrescrever os estilos padrões do St - `fontFamily.mono` — usado para códigos de exemplo ```js {12,14,18,20} -// tailwind.config.cjs -const starlightPlugin = require('@astrojs/starlight-tailwind'); -const colors = require('tailwindcss/colors'); +// tailwind.config.mjs +import starlightPlugin from '@astrojs/starlight-tailwind'; +import colors from 'tailwindcss/colors'; /** @type {import('tailwindcss').Config} */ -module.exports = { +export default { content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], theme: { extend: { diff --git a/docs/src/content/docs/pt-br/reference/overrides.md b/docs/src/content/docs/pt-br/reference/overrides.md index 87af636250..f59a6b3f8a 100644 --- a/docs/src/content/docs/pt-br/reference/overrides.md +++ b/docs/src/content/docs/pt-br/reference/overrides.md @@ -120,7 +120,7 @@ Sumário da página, se ativado. **Tipos:** `{ depth: number; slug: string; text: string }[]` Arranjo de todos os títulos Markdown extraídos da página atual. -Utilize [`toc`](#toc) ao invés se você deseja construir um sumário que respeita as configurações do Starlight. +Utilize [`toc`](#toc) em vez disso se você deseja construir um componente de sumário que respeita as configurações do Starlight. #### `lastUpdated` From c7cac50abc3bbc2bd13225e23bcd70e31a23464a Mon Sep 17 00:00:00 2001 From: HiDeoo Date: Thu, 2 Nov 2023 09:10:35 +0000 Subject: [PATCH 12/22] [ci] format --- docs/src/content/docs/pt-br/guides/authoring-content.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/src/content/docs/pt-br/guides/authoring-content.md b/docs/src/content/docs/pt-br/guides/authoring-content.md index 256ec2a062..37c8ef3bd7 100644 --- a/docs/src/content/docs/pt-br/guides/authoring-content.md +++ b/docs/src/content/docs/pt-br/guides/authoring-content.md @@ -208,6 +208,6 @@ Longos blocos de código de linha única não devem quebrar linha. Eles devem ro Starlight suporta todo o resto da sintaxe de escrita do Markdown, como listas e tabelas. Veja a [Cheat Sheet de Markdown do The Markdown Guide](https://www.markdownguide.org/cheat-sheet/) para uma visão geral rápida de todos os elementos da sintaxe do Markdown. -## Markdown Avançado e Configurando MDX +## Markdown Avançado e Configurando MDX -O Starlight utiliza o mesmo rendizador Markdown e MDX do Astro, que suporta remark e rehype. Você pode adicionar sintaxe e comportamento personalizado adicionando `remarkPlugins` ou `rehypePlugins` no seu arquivo de configuração Astro. Visite [Configurando Markdown e MDX](https://docs.astro.build/pt-br/guides/markdown-content/#configurando-markdown-e-mdx) na documentação do Astro para saber mais. \ No newline at end of file +O Starlight utiliza o mesmo rendizador Markdown e MDX do Astro, que suporta remark e rehype. Você pode adicionar sintaxe e comportamento personalizado adicionando `remarkPlugins` ou `rehypePlugins` no seu arquivo de configuração Astro. Visite [Configurando Markdown e MDX](https://docs.astro.build/pt-br/guides/markdown-content/#configurando-markdown-e-mdx) na documentação do Astro para saber mais. From 48c98e03d91cb5e0ae0506b34111a84c3dd673cb Mon Sep 17 00:00:00 2001 From: Js Park Date: Thu, 2 Nov 2023 18:27:49 +0900 Subject: [PATCH 13/22] i18n(ko-KR): update `frontmatter.md` (#1017) Co-authored-by: HiDeoo <494699+HiDeoo@users.noreply.github.com> --- .../content/docs/ko/reference/frontmatter.md | 40 +++++++++++++++---- 1 file changed, 32 insertions(+), 8 deletions(-) diff --git a/docs/src/content/docs/ko/reference/frontmatter.md b/docs/src/content/docs/ko/reference/frontmatter.md index 2be65a7538..9a8019b8a6 100644 --- a/docs/src/content/docs/ko/reference/frontmatter.md +++ b/docs/src/content/docs/ko/reference/frontmatter.md @@ -109,20 +109,44 @@ hero: --- ``` +밝은 모드와 어두운 모드에서 다양한 버전의 hero 이미지를 표시할 수 있습니다. + +```md +--- +hero: + image: + alt: 반짝이는 밝은 색상의 로고 + dark: ../../assets/logo-dark.png + light: ../../assets/logo-light.png +--- +``` + #### `HeroConfig` ```ts interface HeroConfig { title?: string; tagline?: string; - image?: { - alt?: string; - // 저장소에 있는 이미지의 상대 경로입니다. - file?: string; - // 이미지 슬롯에 사용할 Raw HTML입니다. - // 사용자 정의 `` 태그 또는 인라인 ``일 수 있습니다. - html?: string; - }; + image?: + | { + // 저장소에 있는 이미지의 상대 경로입니다. + file: string; + // 보조 기술이 이미지에 접근할 수 있도록 하는 대체 텍스트입니다. + alt?: string; + } + | { + // 어두운 모드에 사용할 저장소의 이미지에 대한 상대 경로입니다. + dark: string; + // 밝은 모드에 사용할 저장소의 이미지에 대한 상대 경로입니다. + light: string; + // 보조 기술이 이미지에 접근할 수 있도록 하는 대체 텍스트입니다. + alt?: string; + } + | { + // 이미지 슬롯에 사용할 원시 HTML입니다. + // 사용자 정의 `` 태그 또는 인라인 `` 태그일 수 있습니다. + html: string; + }; actions?: Array<{ text: string; link: string; From 67552ceb13565e3aedcad4c72ff8df8a2e53753c Mon Sep 17 00:00:00 2001 From: HiDeoo Date: Thu, 2 Nov 2023 09:28:34 +0000 Subject: [PATCH 14/22] [ci] format --- .../content/docs/ko/reference/frontmatter.md | 38 +++++++++---------- 1 file changed, 19 insertions(+), 19 deletions(-) diff --git a/docs/src/content/docs/ko/reference/frontmatter.md b/docs/src/content/docs/ko/reference/frontmatter.md index 9a8019b8a6..cfacb133d9 100644 --- a/docs/src/content/docs/ko/reference/frontmatter.md +++ b/docs/src/content/docs/ko/reference/frontmatter.md @@ -128,25 +128,25 @@ interface HeroConfig { title?: string; tagline?: string; image?: - | { - // 저장소에 있는 이미지의 상대 경로입니다. - file: string; - // 보조 기술이 이미지에 접근할 수 있도록 하는 대체 텍스트입니다. - alt?: string; - } - | { - // 어두운 모드에 사용할 저장소의 이미지에 대한 상대 경로입니다. - dark: string; - // 밝은 모드에 사용할 저장소의 이미지에 대한 상대 경로입니다. - light: string; - // 보조 기술이 이미지에 접근할 수 있도록 하는 대체 텍스트입니다. - alt?: string; - } - | { - // 이미지 슬롯에 사용할 원시 HTML입니다. - // 사용자 정의 `` 태그 또는 인라인 `` 태그일 수 있습니다. - html: string; - }; + | { + // 저장소에 있는 이미지의 상대 경로입니다. + file: string; + // 보조 기술이 이미지에 접근할 수 있도록 하는 대체 텍스트입니다. + alt?: string; + } + | { + // 어두운 모드에 사용할 저장소의 이미지에 대한 상대 경로입니다. + dark: string; + // 밝은 모드에 사용할 저장소의 이미지에 대한 상대 경로입니다. + light: string; + // 보조 기술이 이미지에 접근할 수 있도록 하는 대체 텍스트입니다. + alt?: string; + } + | { + // 이미지 슬롯에 사용할 원시 HTML입니다. + // 사용자 정의 `` 태그 또는 인라인 `` 태그일 수 있습니다. + html: string; + }; actions?: Array<{ text: string; link: string; From 42ae28835ecadd22e56717a5796e4d758191b7c4 Mon Sep 17 00:00:00 2001 From: Js Park Date: Thu, 2 Nov 2023 22:19:40 +0900 Subject: [PATCH 15/22] i18n(ko-KR): update `i18n.mdx` (#1013) --- docs/src/content/docs/ko/guides/i18n.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/src/content/docs/ko/guides/i18n.mdx b/docs/src/content/docs/ko/guides/i18n.mdx index 23acb39d7b..c1d0c659a5 100644 --- a/docs/src/content/docs/ko/guides/i18n.mdx +++ b/docs/src/content/docs/ko/guides/i18n.mdx @@ -143,7 +143,7 @@ Starlight는 귀하가 모든 언어로 같은 페이지를 생성할 것을 기 Starlight를 사용하면 번역된 콘텐츠 파일을 호스팅하는 것 외에도 독자가 선택한 언어로 사이트 전체를 경험할 수 있도록 기본 UI 문자열(예를 들어, 목차의 제목인 "목차")을 번역할 수 있습니다. -영어, 체코어, 프랑스어, 독일어, 이탈리아어, 일본어, 포르투갈어, 네덜란드어, 덴마크어, 스페인어, 터키어, 아랍어, 노르웨이어, 페르시아어, 히브리어, 중국어 간체, 한국어, 인도네시아어, 러시아어, 스웨덴어, 우크라이나어 및 베트남어로 번역된 UI 문자열이 기본적으로 제공됩니다. 그리고 우리는 [더 많은 기본 언어를 추가하는 데 기여](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md)하는걸 환영합니다. +영어, 체코어, 프랑스어, 독일어, 이탈리아어, 일본어, 포르투갈어, 네덜란드어, 덴마크어, 스페인어, 터키어, 아랍어, 노르웨이어, 페르시아어, 히브리어, 중국어 간체, 한국어, 인도네시아어, 러시아어, 스웨덴어, 우크라이나어, 베트남어 및 갈리시아어로 번역된 UI 문자열이 기본적으로 제공됩니다. 그리고 우리는 [더 많은 기본 언어를 추가하는 데 기여](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md)하는걸 환영합니다. `i18n` 데이터 컬렉션을 통해 지원하는 추가 언어에 대한 번역을 제공하거나 기본 라벨을 변경할 수 있습니다. From a6baf0e87632e64b828ed2189cfbaa335c3c7e18 Mon Sep 17 00:00:00 2001 From: Js Park Date: Thu, 2 Nov 2023 22:21:24 +0900 Subject: [PATCH 16/22] i18n(ko-KR): update `sidebar.mdx` (#1014) --- docs/src/content/docs/ko/guides/sidebar.mdx | 26 ++++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/docs/src/content/docs/ko/guides/sidebar.mdx b/docs/src/content/docs/ko/guides/sidebar.mdx index 58e0858279..20064b3a05 100644 --- a/docs/src/content/docs/ko/guides/sidebar.mdx +++ b/docs/src/content/docs/ko/guides/sidebar.mdx @@ -236,7 +236,7 @@ sidebar: ## 배지 -링크 라벨 옆에 배지를 표시하기 위해 링크에는 `badge` 속성이 포함될 수도 있습니다. +링크, 그룹, 자동 생성된 그룹은 라벨 옆에 배지를 표시하기 위해 `badge` 속성을 포함할 수도 있습니다. ```js starlight({ @@ -252,6 +252,12 @@ starlight({ }, ], }, + // "Deprecated" 배지가 포함된 자동 생성된 그룹 + { + label: '참조', + badge: 'Deprecated', + autogenerate: { directory: 'reference' }, + }, ], }); ``` @@ -270,6 +276,24 @@ starlight({ }, ], }, + { + label: '참조', + badge: { text: 'Deprecated', variant: 'default' }, + items: [ + { + label: '구성 참조', + link: '/reference/configuration/', + }, + { + label: '프론트매터 참조', + link: '/reference/frontmatter/', + }, + { + label: '재정의 참조', + link: '/reference/overrides/', + }, + ], + }, ]} /> From a1d551075e1e7c14a6b12a120ddcf45f8ef3163d Mon Sep 17 00:00:00 2001 From: Js Park Date: Thu, 2 Nov 2023 22:23:23 +0900 Subject: [PATCH 17/22] i18n(ko-KR): update `configuration.mdx` (#1015) --- docs/src/content/docs/ko/reference/configuration.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/src/content/docs/ko/reference/configuration.mdx b/docs/src/content/docs/ko/reference/configuration.mdx index aa9917250f..5593f4be1c 100644 --- a/docs/src/content/docs/ko/reference/configuration.mdx +++ b/docs/src/content/docs/ko/reference/configuration.mdx @@ -181,10 +181,10 @@ sidebar: [ type SidebarItem = { label: string; translations?: Record; + badge?: string | BadgeConfig; } & ( | { link: string; - badge?: string | BadgeConfig; attrs?: Record; } | { items: SidebarItem[]; collapsed?: boolean } From b97d633f348a25f6662f7146004b4bf3121e9025 Mon Sep 17 00:00:00 2001 From: liruifengv Date: Thu, 2 Nov 2023 21:47:58 +0800 Subject: [PATCH 18/22] i18n(zh-cn): Update authoring-content.md (#1016) --- docs/src/content/docs/zh-cn/guides/authoring-content.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/src/content/docs/zh-cn/guides/authoring-content.md b/docs/src/content/docs/zh-cn/guides/authoring-content.md index f2029a0457..cf9fbae414 100644 --- a/docs/src/content/docs/zh-cn/guides/authoring-content.md +++ b/docs/src/content/docs/zh-cn/guides/authoring-content.md @@ -206,3 +206,7 @@ var fun = function lang(l) { ## 其它通用 Markdown 语法 Starlight 支持所有其他 Markdown 语法,例如列表和表格。 请参阅 [Markdown 指南的 Markdown 速查表](https://www.markdownguide.org/cheat-sheet/) 以快速了解所有 Markdown 语法元素。 + +## 高级 Markdown 和 MDX 配置 + +Starlight 使用 Astro 的 Markdown 和 MDX 渲染器,该渲染器构建在 remark 和 rehype 之上。 你可以通过在 Astro 配置文件中添加 `remarkPlugins` 或 `rehypePlugins` 来添加对自定义语法和行为的支持。 请参阅 Astro 文档中的 [“配置 Markdown 和 MDX”](https://docs.astro.build/zh-cn/guides/markdown-content/#配置-markdown) 以了解更多信息。 \ No newline at end of file From d101a84d4ef5ecda467b6e328ffdbdc6a1610de9 Mon Sep 17 00:00:00 2001 From: delucis Date: Thu, 2 Nov 2023 13:48:52 +0000 Subject: [PATCH 19/22] [ci] format --- docs/src/content/docs/zh-cn/guides/authoring-content.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/src/content/docs/zh-cn/guides/authoring-content.md b/docs/src/content/docs/zh-cn/guides/authoring-content.md index cf9fbae414..b1ef4d9568 100644 --- a/docs/src/content/docs/zh-cn/guides/authoring-content.md +++ b/docs/src/content/docs/zh-cn/guides/authoring-content.md @@ -209,4 +209,4 @@ Starlight 支持所有其他 Markdown 语法,例如列表和表格。 请参 ## 高级 Markdown 和 MDX 配置 -Starlight 使用 Astro 的 Markdown 和 MDX 渲染器,该渲染器构建在 remark 和 rehype 之上。 你可以通过在 Astro 配置文件中添加 `remarkPlugins` 或 `rehypePlugins` 来添加对自定义语法和行为的支持。 请参阅 Astro 文档中的 [“配置 Markdown 和 MDX”](https://docs.astro.build/zh-cn/guides/markdown-content/#配置-markdown) 以了解更多信息。 \ No newline at end of file +Starlight 使用 Astro 的 Markdown 和 MDX 渲染器,该渲染器构建在 remark 和 rehype 之上。 你可以通过在 Astro 配置文件中添加 `remarkPlugins` 或 `rehypePlugins` 来添加对自定义语法和行为的支持。 请参阅 Astro 文档中的 [“配置 Markdown 和 MDX”](https://docs.astro.build/zh-cn/guides/markdown-content/#配置-markdown) 以了解更多信息。 From b88721c2406b6df67635cfa674be5b82d5c6c596 Mon Sep 17 00:00:00 2001 From: liruifengv Date: Thu, 2 Nov 2023 22:15:51 +0800 Subject: [PATCH 20/22] i18n(zh-cn): Update css-and-tailwind.mdx (#1018) --- .../docs/zh-cn/guides/css-and-tailwind.mdx | 22 +++++++++---------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx b/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx index 71826b8901..86440928a4 100644 --- a/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx +++ b/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx @@ -181,17 +181,17 @@ yarn create astro --template starlight/tailwind }); ``` -5. 将 Starlight Tailwind 插件添加到 `tailwind.config.cjs`: +5. 将 Starlight Tailwind 插件添加到 `tailwind.config.mjs`: ```js ins={2,7} - // tailwind.config.cjs - const starlightPlugin = require('@astrojs/starlight-tailwind'); + // tailwind.config.mjs + import starlightPlugin from '@astrojs/starlight-tailwind'; /** @type {import('tailwindcss').Config} */ - module.exports = { - content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], - plugins: [starlightPlugin()], - }; + export default { + content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], + plugins: [starlightPlugin()], + }; ``` ### 使用 Tailwind 设置 Starlight 的样式 @@ -206,12 +206,12 @@ Starlight 将使用你的 [Tailwind 主题配置](https://tailwindcss.com/docs/t - `fontFamily.mono` — 用于代码示例 ```js {12,14,18,20} -// tailwind.config.cjs -const starlightPlugin = require('@astrojs/starlight-tailwind'); -const colors = require('tailwindcss/colors'); +// tailwind.config.mjs +import starlightPlugin from '@astrojs/starlight-tailwind'; +import colors from 'tailwindcss/colors'; /** @type {import('tailwindcss').Config} */ -module.exports = { +export default { content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], theme: { extend: { From 99390333647f515fc7a03cdc02caef134aaeac13 Mon Sep 17 00:00:00 2001 From: delucis Date: Thu, 2 Nov 2023 14:16:25 +0000 Subject: [PATCH 21/22] [ci] format --- .../content/docs/zh-cn/guides/css-and-tailwind.mdx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx b/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx index 86440928a4..08088bd2fd 100644 --- a/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx +++ b/docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx @@ -184,14 +184,14 @@ yarn create astro --template starlight/tailwind 5. 将 Starlight Tailwind 插件添加到 `tailwind.config.mjs`: ```js ins={2,7} - // tailwind.config.mjs - import starlightPlugin from '@astrojs/starlight-tailwind'; + // tailwind.config.mjs + import starlightPlugin from '@astrojs/starlight-tailwind'; /** @type {import('tailwindcss').Config} */ - export default { - content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], - plugins: [starlightPlugin()], - }; + export default { + content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], + plugins: [starlightPlugin()], + }; ``` ### 使用 Tailwind 设置 Starlight 的样式 From 0d1e75e17269ddac3eb15b7dfb4480da1bb01c6c Mon Sep 17 00:00:00 2001 From: HiDeoo <494699+HiDeoo@users.noreply.github.com> Date: Thu, 2 Nov 2023 16:35:17 +0100 Subject: [PATCH 22/22] fix(docs-i18n-tracker): update `translations` import (#1025) --- .changeset/polite-colts-turn.md | 5 +++++ packages/starlight/utils/createTranslationSystem.ts | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/polite-colts-turn.md diff --git a/.changeset/polite-colts-turn.md b/.changeset/polite-colts-turn.md new file mode 100644 index 0000000000..0e46da7f82 --- /dev/null +++ b/.changeset/polite-colts-turn.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': patch +--- + +Internal: fix import issue in translation string loading mechanism diff --git a/packages/starlight/utils/createTranslationSystem.ts b/packages/starlight/utils/createTranslationSystem.ts index 97a79e3a52..188b176c4f 100644 --- a/packages/starlight/utils/createTranslationSystem.ts +++ b/packages/starlight/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(