API

Cette page documente les points d’extension disponibles dans Lumen pour personnaliser et étendre votre documentation.

Intégration Starlight

L’objet de configuration starlight() accepte les options suivantes :

interface StarlightConfig {
  /** Titre du site affiché dans l'en-tête. */
  title: string;
  /** Description pour le SEO (optionnelle). */
  description?: string;
  /** Logo personnalisé. */
  logo?: {
    src: string;
    alt?: string;
    replacesTitle?: boolean;
  };
  /** Configuration de la barre latérale. */
  sidebar?: SidebarGroup[];
  /** Liens sociaux affichés dans l'en-tête. */
  social?: SocialLink[];
  /** Pied de page personnalisé. */
  footer?: FooterConfig;
  /** Thème par défaut. */
  defaultTheme?: 'light' | 'dark' | 'auto';
  /** Table des matières. */
  tableOfContents?: TableOfContentsConfig;
  /** Langues supportées (i18n). */
  locales?: Record<string, LocaleConfig>;
  /** Feuilles CSS personnalisées. */
  customCss?: string[];
}

Composants intégrés

Lumen expose plusieurs composants réutilisables dans vos pages MDX :

Card & CardGrid

import { Card, CardGrid } from '@astrojs/starlight/components';

<CardGrid stagger>
  <Card title="Titre" icon="rocket">
    Description de la carte.
  </Card>
  <Card title="Autre titre" icon="pencil">
    Une autre description.
  </Card>
</CardGrid>

Props de Card :

Prop	Type	Description
title	string	Titre de la carte.
icon	string	Nom d’une icône intégrée (optionnel).
href	string	Transforme la carte en lien.
variant	string	Style alternatif ('minimal').

Tabs & TabItem

import { Tabs, TabItem } from '@astrojs/starlight/components';

<Tabs>
  <TabItem label="pnpm">pnpm add @astrojs/starlight</TabItem>
  <TabItem label="npm">npm install @astrojs/starlight</TabItem>
  <TabItem label="yarn">yarn add @astrojs/starlight</TabItem>
</Tabs>

Aside (callouts)

import { Aside } from '@astrojs/starlight/components';

<Aside type="caution">
  Cette opération est irréversible. Sauvegardez vos données avant de continuer.
</Aside>

<Aside type="tip">
  Utilisez le raccourci `Ctrl+K` pour ouvrir la recherche.
</Aside>

Types disponibles : note, tip, caution, danger.

Steps

import { Steps } from '@astrojs/starlight/components';

<Steps>
  1. Installez les dépendances avec `pnpm install`. 2. Configurez le fichier
  `astro.config.mjs`. 3. Lancez le serveur avec `pnpm dev`.
</Steps>

Hooks de cycle de vie

Lumen s’intègre au système de hooks d’Astro. Les hooks suivants sont particulièrement utiles :

Hook	Description
astro:config:setup	Modifier la configuration avant le build.
astro:build:start	Exécuter du code avant la génération.
astro:build:done	Exécuter du code après la génération.

Exemple d’utilisation dans une intégration :

export default {
  name: 'mon-plugin',
  hooks: {
    'astro:config:setup': ({ injectRoute }) => {
      injectRoute({
        pattern: '/custom',
        entrypoint: './src/pages/custom.astro',
      });
    },
  },
};

---

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.