Actions

Lien

رابطLink

Stablesrc/dsm/components/link.tsx
Deux liens de contenu : `TextLink` pour un lien de texte courant (interne ou externe, avec repère de nouvelle fenêtre), et `DownloadLink` pour un document téléchargeable avec son format et sa taille.

Import

import { TextLink } from "@/dsm/components/link";

Exemples

Interne et externe

Un lien interne (next/link) et un lien externe détecté automatiquement.

LTR

Consultez la liste des pièces à fournir avant de déposer votre dossier, ou rendez-vous directement sur idarati.ma (nouvelle fenêtre) pour suivre son avancement.

Variantes

Les styles `default`, `subtle` et `inverse` (sur fond sombre).

LTR

Variante default — pour un lien de contenu ordinaire.

Variante subtle — un lien discret dans un texte dense.

Variante inverse — sur un fond sombre.

Téléchargement de documents

Liste de formulaires téléchargeables avec format et taille.

Usage

Quand l'utiliser

  • Utilisez `TextLink` dans un paragraphe ou une liste ; le repère « nouvelle fenêtre » s'ajoute automatiquement pour toute URL commençant par http(s).
  • Utilisez `DownloadLink` pour tout document (PDF, formulaire) proposé au téléchargement, avec son format et son poids.

Quand ne pas l'utiliser

  • N'utilisez pas `TextLink` pour une action qui ne change pas de page (ouvrir une modale, trier une liste) : utilisez un bouton `variant="link"`.

Accessibilité & langues

Accessibilité

  • Un lien externe ouvre un nouvel onglet (`target="_blank"`, `rel="noopener noreferrer"`) et porte un texte masqué annonçant « nouvelle fenêtre ».
  • `DownloadLink` porte l'attribut natif `download` et un texte masqué « Télécharger », en plus du format et de la taille visibles.

RTL & multilingue

  • L'icône de nouvelle fenêtre (`ExternalLink`) a un sens fixe et ne se retourne jamais.
  • Le texte du lien reste aligné en début de ligne (`text-start`) dans `DownloadLink`, quel que soit le sens de lecture.

Propriétés

TextLink
PropriétéTypeDéfautDescription
href*string—Cible du lien.
externalboolean—Force le traitement interne/externe ; auto-détecté depuis `href` (http/https) si omis.
variant"default" | "subtle" | "inverse"defaultCouleur et style de soulignement du lien.
size"inherit" | "sm"inheritTaille du texte.
DownloadLink
PropriétéTypeDéfautDescription
href*string—URL du fichier.
label*ReactNode—Nom du document.
format*string—Format affiché dans la métadonnée, p. ex. « PDF ».
size*string—Taille affichée, p. ex. « 1,2 Mo ».
langstring—Langue du document, si différente de la page.

Composants liés