@dsfrkit/react 0.1.0

package/dist/components/ui/link.d.ts

@@ -0,0 +1,56 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * Variants du lien DSFR
+ * Conforme au design system : https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/lien
+ */
+declare const linkVariants: (props?: ({
+    variant?: "default" | "muted" | "destructive" | "inverted" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    underline?: "none" | "always" | "hover" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement>, VariantProps<typeof linkVariants> {
+    /**
+     * Si true, rend le composant enfant au lieu d'un <a>
+     * Utile pour l'intégration avec les routeurs (Next.js, React Router, TanStack Router)
+     *
+     * @example
+     * ```tsx
+     * // Avec Next.js Link
+     * <Link asChild>
+     *   <NextLink href="/about">À propos</NextLink>
+     * </Link>
+     *
+     * // Avec React Router
+     * <Link asChild>
+     *   <RouterLink to="/about">À propos</RouterLink>
+     * </Link>
+     *
+     * // Avec TanStack Router
+     * <Link asChild>
+     *   <TanStackLink to="/about">À propos</TanStackLink>
+     * </Link>
+     * ```
+     */
+    asChild?: boolean;
+    /**
+     * Si true, ouvre le lien dans un nouvel onglet avec rel="noopener noreferrer"
+     */
+    external?: boolean;
+    /**
+     * Affiche une icône externe à côté du lien
+     */
+    showExternalIcon?: boolean;
+    /**
+     * Contrôle le soulignement du lien
+     * - `always` : toujours souligné (défaut, recommandé a11y WCAG 1.4.1)
+     * - `hover` : souligné au hover uniquement (style DSFR natif)
+     * - `none` : jamais souligné
+     */
+    underline?: 'always' | 'hover' | 'none';
+}
+declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+
+export { Link, type LinkProps, linkVariants };

package/dist/components/ui/link.js

@@ -0,0 +1,150 @@
+'use strict';
+
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var React = require('react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var RouterContext = React__namespace.createContext(null);
+function useRouter() {
+  return React__namespace.useContext(RouterContext);
+}
+var linkVariants = classVarianceAuthority.cva(
+  "inline-flex items-center gap-1 font-medium underline-offset-2 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary rounded",
+  {
+    variants: {
+      variant: {
+        default: "text-primary hover:text-primary-hover",
+        muted: "text-muted-foreground hover:text-foreground",
+        inverted: "text-foreground-inverted hover:opacity-80",
+        destructive: "text-destructive hover:opacity-80"
+      },
+      size: {
+        sm: "text-sm",
+        md: "text-base",
+        lg: "text-lg"
+      },
+      underline: {
+        always: "underline",
+        hover: "no-underline hover:underline",
+        none: "no-underline"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "md",
+      underline: "always"
+    }
+  }
+);
+function ExternalIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "14",
+      height: "14",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
+        /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "15,3 21,3 21,9" }),
+        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
+      ]
+    }
+  );
+}
+var Link = React__namespace.forwardRef(
+  ({
+    className,
+    variant,
+    size,
+    asChild = false,
+    external = false,
+    showExternalIcon = false,
+    underline,
+    children,
+    ...props
+  }, ref) => {
+    const router = useRouter();
+    const externalProps = external ? { target: "_blank", rel: "noopener noreferrer" } : {};
+    if (asChild) {
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        reactSlot.Slot,
+        {
+          ref,
+          className: cn(linkVariants({ variant, size, underline, className })),
+          ...externalProps,
+          ...props,
+          children: [
+            children,
+            showExternalIcon && /* @__PURE__ */ jsxRuntime.jsx(ExternalIcon, {})
+          ]
+        }
+      );
+    }
+    if (router && !external) {
+      const { href: hrefProp, ...restProps } = props;
+      const adaptedProps = router.linkPropsAdapter({ href: hrefProp, ...restProps });
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        router.Link,
+        {
+          ref,
+          className: cn(linkVariants({ variant, size, underline, className })),
+          ...adaptedProps,
+          children: [
+            children,
+            showExternalIcon && /* @__PURE__ */ jsxRuntime.jsx(ExternalIcon, {})
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "a",
+      {
+        ref,
+        className: cn(linkVariants({ variant, size, underline, className })),
+        ...externalProps,
+        ...props,
+        children: [
+          children,
+          showExternalIcon && /* @__PURE__ */ jsxRuntime.jsx(ExternalIcon, {})
+        ]
+      }
+    );
+  }
+);
+Link.displayName = "Link";
+
+exports.Link = Link;
+exports.linkVariants = linkVariants;

package/dist/components/ui/link.mjs

@@ -0,0 +1,3 @@
+export { Link, linkVariants } from '../../chunk-YD3HHOXQ.mjs';
+import '../../chunk-C4BBQTZ3.mjs';
+import '../../chunk-SZOFVBTZ.mjs';

package/dist/components/ui/logo.d.mts

@@ -0,0 +1,58 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * Composant Logo DSFR
+ * Affiche le logo officiel de la République Française
+ * Conforme au design system : https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/logo
+ *
+ * Utilise les SVG officiels du DSFR (Marianne + devise)
+ * Source : https://github.com/GouvernementFR/dsfr/blob/main/src/dsfr/component/logo/style/_setting.scss
+ */
+declare const logoVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface LogoProps extends React.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof logoVariants> {
+    /** Texte alternatif pour l'accessibilité */
+    alt?: string;
+    /** Affiche la devise "Liberté Égalité Fraternité" (défaut : true) */
+    showMotto?: boolean;
+    /** Texte institutionnel à afficher */
+    serviceTitle?: React.ReactNode;
+}
+/**
+ * Logo de la République Française
+ *
+ * @example
+ * ```tsx
+ * <Logo />
+ * <Logo size="lg" />
+ * <Logo size="sm" />
+ * ```
+ */
+declare const Logo: React.ForwardRefExoticComponent<LogoProps & React.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Logo de service (à côté du logo République Française)
+ */
+interface ServiceLogoProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Nom du service
+     */
+    serviceName: string;
+    /**
+     * Description ou tagline du service
+     */
+    serviceTagline?: string;
+    /**
+     * URL du logo du service (optionnel)
+     */
+    logoUrl?: string;
+    /**
+     * Texte alternatif pour le logo
+     */
+    logoAlt?: string;
+}
+declare const ServiceLogo: React.ForwardRefExoticComponent<ServiceLogoProps & React.RefAttributes<HTMLDivElement>>;
+
+export { Logo, type LogoProps, ServiceLogo, type ServiceLogoProps, logoVariants };

package/dist/components/ui/logo.d.ts

@@ -0,0 +1,58 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * Composant Logo DSFR
+ * Affiche le logo officiel de la République Française
+ * Conforme au design system : https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/logo
+ *
+ * Utilise les SVG officiels du DSFR (Marianne + devise)
+ * Source : https://github.com/GouvernementFR/dsfr/blob/main/src/dsfr/component/logo/style/_setting.scss
+ */
+declare const logoVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface LogoProps extends React.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof logoVariants> {
+    /** Texte alternatif pour l'accessibilité */
+    alt?: string;
+    /** Affiche la devise "Liberté Égalité Fraternité" (défaut : true) */
+    showMotto?: boolean;
+    /** Texte institutionnel à afficher */
+    serviceTitle?: React.ReactNode;
+}
+/**
+ * Logo de la République Française
+ *
+ * @example
+ * ```tsx
+ * <Logo />
+ * <Logo size="lg" />
+ * <Logo size="sm" />
+ * ```
+ */
+declare const Logo: React.ForwardRefExoticComponent<LogoProps & React.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Logo de service (à côté du logo République Française)
+ */
+interface ServiceLogoProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Nom du service
+     */
+    serviceName: string;
+    /**
+     * Description ou tagline du service
+     */
+    serviceTagline?: string;
+    /**
+     * URL du logo du service (optionnel)
+     */
+    logoUrl?: string;
+    /**
+     * Texte alternatif pour le logo
+     */
+    logoAlt?: string;
+}
+declare const ServiceLogo: React.ForwardRefExoticComponent<ServiceLogoProps & React.RefAttributes<HTMLDivElement>>;
+
+export { Logo, type LogoProps, ServiceLogo, type ServiceLogoProps, logoVariants };

package/dist/components/ui/logo.js

@@ -0,0 +1,225 @@
+'use strict';
+
+var classVarianceAuthority = require('class-variance-authority');
+var React = require('react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+// src/components/ui/logo.tsx
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var logoVariants = classVarianceAuthority.cva("inline-flex flex-col", {
+  variants: {
+    size: {
+      sm: "text-xs",
+      md: "text-sm",
+      lg: "text-base"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var MarianneSvg = React__namespace.memo(() => /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 44 18",
+    "aria-hidden": "true",
+    className: "w-full h-full",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          fill: "#fff",
+          d: "M11.3 10.2c-.9.6-1.7 1.3-2.3 2.1v-.1c.4-.5.7-1 1-1.5.4-.2.7-.5 1-.8.5-.5 1-1 1.7-1.3.3-.1.5-.1.8 0-.1.1-.2.1-.4.2H13v-.1c-.3.3-.7.5-1 .9-.1.2-.2.6-.7.6 0 .1.1 0 0 0zm1.6 4.6c0-.1-.1 0-.2 0l-.1.1-.1.1-.2.2s.1.1.2 0l.1-.1c.1 0 .2-.1.2-.2.1 0 .1 0 .1-.1 0 .1 0 0 0 0zm-1.6-4.3c.1 0 .2 0 .2-.1s.1-.1.1-.1v-.1c-.2.1-.3.2-.3.3zm2.4 1.9s0-.1 0 0c.1-.1.2-.1.3-.1.7-.1 1.4-.3 2.1-.6-.8-.5-1.7-.9-2.6-1h.1c-.1-.1-.3-.1-.5-.2h.1c-.2-.1-.5-.1-.7-.2.1 0 .2-.2.2-.3h-.1c-.4.2-.6.5-.8.9.2.1.5 0 .7.1h-.3c-.1 0-.2.1-.2.2h.1c-.1 0-.1.1-.2.1.1.1.2 0 .4 0 0 .1.1.1.1.1-.1 0-.2.1-.3.3-.1.2-.2.2-.3.3v.1c-.3.2-.6.5-.9.8v.1c-.1.1-.2.1-.2.2v.1c.4-.1.6-.4 1-.5l.6-.3c.2 0 .3-.1.5-.1v.1h.2c0 .1-.2 0-.1.1s.3.1.4 0c.2-.2.3-.2.4-.2zM12.4 14c-.4.2-.9.2-1.2.4 0 0 0 .1-.1.1 0 0-.1 0-.1.1-.1 0-.1.1-.2.2l-.1.1s0 .1.1 0l.1-.1s-.1.1-.1.2V15.3l-.1.1s0 .1-.1.1l-.1.1.2-.2.1-.1h.2s0-.1.1-.1c.1-.1.2-.2.3-.2h.1c.1-.1.3-.1.4-.2.1-.1.2-.2.3-.2.2-.2.5-.3.8-.5-.1 0-.2-.1-.3-.1 0 .1-.2 0-.3 0zM30 9.7c-.1.2-.4.2-.6.3-.2.2 0 .4.1.5.1.3-.2.5-.4.5.1.1.2.1.2.1 0 .2.2.2.1.4s-.5.3-.3.5c.1.2.1.5 0 .7-.1.2-.3.4-.5.5-.2.1-.4.1-.6 0-.1 0-.1-.1-.2-.1-.5-.1-1-.2-1.5-.2-.1 0-.3.1-.4.1-.1.1-.3.2-.4.3l-.1.1c-.1.1-.2.2-.2.3-.1.2-.2.4-.2.6-.2.5-.2 1 0 1.4 0 0 1 .3 1.7.6.2.1.5.2.7.4l1.7 1H13.2l1.6-1c.6-.4 1.3-.7 2-1 .5-.2 1.1-.5 1.5-.9.2-.2.3-.4.5-.5.3-.4.6-.7 1-1l.3-.3s0-.1.1-.1c-.2.1-.2.2-.4.2 0 0-.1 0 0-.1s.2-.2.3-.2v-.1c-.4 0-.7.2-1 .5h-.2c-.5.2-.8.5-1.2.7v-.1c-.2.1-.4.2-.5.2-.2 0-.5.1-.8 0-.4 0-.7.1-1.1.2-.2.1-.4.1-.6.2v.1l-.2.2c-.2.1-.3.2-.5.4l-.5.5h-.1l.1-.1.1-.1c0-.1.1-.1.1-.2.2-.1.3-.3.5-.4 0 0-.1 0 0 0 0 0 0-.1.1-.1l-.1.1c-.1.1-.1.2-.2.2v-.1-.1l.2-.2c.1-.1.2-.1.3-.2h.1c-.2.1-.3.1-.5.2H14h-.1c0-.1.1-.1.2-.2h.1c1-.8 2.3-.6 3.4-1 .1-.1.2-.1.3-.2.1-.1.3-.2.5-.3.2-.2.4-.4.5-.7v-.1c-.4.4-.8.7-1.3 1-.6.2-1.3.4-2 .4 0-.1.1-.1.1-.1 0-.1.1-.1.1-.2h.1s0-.1.1-.1h.1c-.1-.1-.3.1-.4 0 .1-.1 0-.2.1-.2h.1s0-.1.1-.1c.5-.3.9-.5 1.3-.7-.1 0-.1.1-.2 0 .1 0 0-.1.1-.1.3-.1.6-.3.9-.4-.1 0-.2.1-.3 0 .1 0 .1-.1.2-.1v-.1h0c0-.1.1 0 .2-.1h-.1c.1-.1.2-.2.4-.2 0-.1-.1 0-.1-.1h.1-.5c-.1 0 0-.1 0-.1.1-.2.2-.5.3-.7h-.1c-.3.3-.8.5-1.2.6h-.2c-.2.1-.4.1-.5 0-.1-.1-.2-.2-.3-.2-.2-.1-.5-.3-.8-.4-.7-.2-1.5-.4-2.3-.3.3-.1.7-.2 1.1-.3.5-.2 1-.3 1.5-.3h-.3c-.4 0-.9.1-1.3.2-.3.1-.6.2-.9.2-.2.1-.3.2-.5.2v-.1c.3-.4.7-.7 1.1-.8.5-.1 1.1 0 1.6.1.4 0 .8.1 1.1.2.1 0 .2.2.3.3.2.1.4 0 .5.1v-.2c.1-.1.3 0 .4 0 .2-.2-.2-.4-.3-.6v-.1c.2.2.5.4.7.6.1.1.5.2.5 0-.2-.3-.4-.6-.7-.9v-.2c-.1 0-.1 0-.1-.1-.1-.1-.1-.2-.1-.3-.1-.2 0-.4-.1-.5-.1-.2-.1-.3-.1-.5-.1-.5-.2-1-.3-1.4-.1-.6.3-1 .6-1.5.2-.4.5-.7.8-1 .1-.4.3-.7.6-1 .3-.3.6-.5.9-.6.3-.1.5-.2.8-.3l2.5-.4H25l1.8.3c.1 0 .2 0 .2.1.1.1.3.2.4.2.2.1.4.3.6.5.1.1.2.3.1.4-.1.1-.1.4-.2.4-.2.1-.4.1-.6.1-.1 0-.2 0-.4-.1.5.2.9.4 1.2.8 0 .1.2.1.3.1v.1c-.1.1-.1.1-.1.2h.1c.1-.1.1-.4.3-.3.2.1.2.3.1.4-.1.1-.2.2-.4.3v.2c.1.1.1.2.2.4s.1.5.2.7c.1.5.2.9.2 1.4 0 .2-.1.5 0 .7l.3.6c.1.2.2.3.3.5.2.3.6.6.4 1zm-15.6 5.2c-.1 0-.1.1-.1.1s.1 0 .1-.1zm5.8-1.8c-.1.1 0 0 0 0zm-6.7-.2c0 .1.1 0 .1 0 .2-.1.5 0 .6-.2-.1-.1-.2 0-.2-.1-.1 0-.2 0-.2.1-.1.1-.3.1-.3.2z"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          fill: "#fff",
+          d: "M27.9 6.8c.1 0 .3 0 .3.1-.1.2-.4.3-.6.5h-.1c-.1.1-.1.2-.1.2h-.3c.1.1.3.2.5.2l.1.1h.2V8c-.1.1-.2.1-.4.1.2.1.5.1.7 0 .2-.1 0-.4.1-.5-.1 0 0-.1-.1-.1.1-.1.1-.2.2-.2s.1 0 .2-.1c0-.1-.1-.1-.1-.2.2-.1.3-.3.3-.5 0-.1-.3-.1-.4-.2h-.5c-.2 0-.3.1-.5.1l-.6.3c.2-.1.4-.1.7-.2 0 .3.2.3.4.3"
+        }
+      )
+    ]
+  }
+));
+MarianneSvg.displayName = "MarianneSvg";
+var MottoSvg = React__namespace.memo(() => /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 126 90",
+    "aria-hidden": "true",
+    className: "w-full h-full",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-a", viewBox: "0 0 11 15.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10.4 5.3C11.9 1.5 10.1 0 7.9 0 4.2 0 0 6.5 0 11.7c0 2.5 1.2 3.8 3 3.8 2.1 0 4.3-2 6.2-5.5h-1c-1.2 1.5-2.6 2.6-3.9 2.6-1.3 0-2-.8-2-2.6a10.7 10.7 0 01.3-2.2zm-4-3.1c1.1 0 2 .8 1.5 2.6L3.1 6.1c.8-2.2 2.2-4 3.4-4z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("symbol", { id: "dsfr-b", viewBox: "0 0 12.4 21.8", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11", height: "15.5", y: "6.4", href: "#dsfr-a" }),
+          /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.9 4.7L12.4.6V0h-3L6.7 4.7H8z" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-c", viewBox: "0 0 11.5 19", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M1.7 5.7h2.6L.1 17.1a1.3 1.3 0 001.2 2c3 0 6.4-2.6 7.8-6.2h-.7a9.4 9.4 0 01-5.1 3.5L7 5.7H11l.5-1.6H7.7L9 0H7.6L4.9 4.1l-3.2.4v1.2z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-d", viewBox: "0 0 9.8 21.9", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.6 8c.3-1-.4-1.6-1-1.6-2.2 0-5 2.1-6 5h.7A5.6 5.6 0 014.4 9L.1 20.3a1.1 1.1 0 001 1.6c2.2 0 4.7-2 5.8-5H6A5.6 5.6 0 013 19.5zM8 3.7a1.8 1.8 0 001.8-1.8A1.8 1.8 0 008 0a1.8 1.8 0 00-1.8 1.8A1.8 1.8 0 008 3.6" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-e", viewBox: "0 0 14.8 15.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3.3 3.1c.7 0 1 1 0 3.4l-3 6.8c-.7 1.3 0 2.2 1.2 2.2a1.3 1.3 0 001.5-1l3-8C7.4 4.8 10 3 11 3s.8.6.3 1.6l-4.6 9a1.3 1.3 0 001.1 1.9c2.3 0 5-2 6-5h-.6A5.6 5.6 0 0110 13l4-8a6.1 6.1 0 00.8-2.8A2 2 0 0012.6 0c-2 0-3.6 2.2-6 5V2.8C6.6 1.4 6.1 0 4.8 0 3.2 0 1.8 2.5.7 4.9h.7c.7-1.1 1.3-1.8 2-1.8" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-f", viewBox: "0 0 12 15.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11.8 3.5c.5-1.9.2-3.5-1.2-3.5-1.8 0-2.3 1.2-4 5V2.8C6.5 1.3 6 0 4.6 0 3.1 0 1.7 2.5.5 5h.8C2 3.7 2.8 3 3.3 3c.7 0 1 1 0 3.4l-3 6.8c-.7 1.3 0 2.1 1.2 2.1a1.3 1.3 0 001.5-1l3-8a50.3 50.3 0 012.6-3h3.2z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-g", viewBox: "0 0 14.7 16.2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10.5 13.1c-.6 0-1-1 0-3.4L14.6.1 13.4 0l-1.3 1.3h-.3C6.1 1.3 0 8.6 0 14.2a2 2 0 002.1 2.1c1.7 0 3.3-2.4 5.2-5l-.1 1c-.3 2.6.6 4 2 4 1.5 0 3-2.4 4-4.9h-.7c-.7 1.1-1.5 1.8-2 1.8zM7.9 9.8c-1.3 1.6-3.4 3.5-4.3 3.5-.5 0-.9-.5-.9-1.6 0-3.5 4-8.2 6-8.2a4.2 4.2 0 011.4.2z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-h", viewBox: "0 0 21.9 19.8", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11.2 19.8l.3-.9c-3.8-.7-4.3-.7-2.7-4.8l1.4-3.9h3c1.9 0 1.9.9 1.6 3h1l2.6-6.9h-1c-1 1.6-1.8 2.9-3.8 2.9h-3l2-5.6c.8-2 1.1-2.4 3.7-2.4h.7c2.6 0 3 .7 3 3.5h1l.9-4.7H7.3L7 .9c3 .6 3.3.9 2 4.8L5.7 14c-1.5 3.9-2 4.2-5.5 4.8l-.3.9z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-i", viewBox: "0 0 10.1 21.9", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2.9 19.4L10.1.3 9.8 0l-5 .6v.6l1 .7c.9.7.6 1.3-.2 3.4L.2 19.9a1.3 1.3 0 001.1 2c2.3 0 4.7-2.1 5.8-5h-.7a6.5 6.5 0 01-3.5 2.5" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-j", viewBox: "0 0 18 22", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 .6h-4.3a3.8 3.8 0 00-2.1-.6A6.6 6.6 0 005 6.5a3.3 3.3 0 003 3.6c-1.9.8-3 1.8-3 2.9a1.7 1.7 0 00.9 1.5c-4.3 1.3-6 2.8-6 4.7 0 2 2.6 2.8 5.6 2.8 5.3 0 9.6-2.7 9.6-5.1 0-1.8-1.6-2.5-4.3-3.3-2.2-.7-3.2-.8-3.2-1.6A2.4 2.4 0 019 10.2a6.6 6.6 0 006.1-6.5 4.5 4.5 0 00-.2-1.5h2.5zM9.8 16.2c2.1.7 3 1 3 1.6 0 1.4-2 2.5-5.6 2.5-2.7 0-4-.6-4-2 0-1.5 1.4-2.5 3.5-3.3a21.5 21.5 0 003 1.2zM9 9c-1 0-1.3-.8-1.3-1.7 0-2.8 1.4-6.2 3.5-6.2 1 0 1.3.8 1.3 1.6 0 2.9-1.4 6.3-3.5 6.3z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-k", viewBox: "0 0 23 25.1", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14.3 15.6c1.9 0 2 .8 1.6 2.8H17l2.5-6.8h-1c-1 1.6-1.7 2.9-3.8 2.9h-4.1l2-5.6c.7-2 1-2.4 3.7-2.4H18c2.6 0 3 .7 3 3.5h1l.9-4.7H7.3l-.3.9c3 .6 3.3.9 2 4.8l-3.2 8.4c-1.5 3.9-2 4.2-5.6 4.8l-.2 1h17.4l3.2-5h-1.2c-2 2-4 3.8-8 3.8-4.7 0-4.3-.3-2.7-4.6l1.4-3.8h4.2zm2.3-11.8L21 .6V0h-3l-2.6 3.9h1.2v-.1z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-l", viewBox: "0 0 13.6 21.8", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11.4 6.4c-2 0-4 2.2-5.8 4.8L9.6.3 9.4 0l-5 .6V1l1 .8c.9.7.6 1.3-.2 3.4L.8 16.8A13.9 13.9 0 000 19c0 1.4 1.8 2.7 3.5 2.7 3.8 0 10-6.9 10-12.2 0-2.3-.5-3.2-2.1-3.2zM4.8 19.5c-.8 0-1.9-.7-1.9-1.3a15.5 15.5 0 01.8-2.2L5 12.7C6.3 11 8.4 9.3 9.6 9.3c.7 0 1.2.4 1.2 1.5 0 3.1-2.9 8.7-6 8.7z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("symbol", { id: "dsfr-m", viewBox: "0 0 19.2 19.9", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17.6 0H7.3L7 .9c3 .6 3.3.9 2 4.8l-3.2 8.5c-1.5 3.9-2 4.2-5.5 4.8L0 20h15.7l3.5-6H18c-2 2-4.2 4.8-7.7 4.8-2.7 0-3-.5-1.6-4.5l3.1-8.5c1.4-3.9 2-4.2 5.5-4.8z" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("symbol", { id: "dsfr-n", viewBox: "0 0 126 90", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "12.4", height: "21.8", x: "112.7", y: "66.1", href: "#dsfr-b" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11.5", height: "19", x: "102.2", y: "69", href: "#dsfr-c" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "9.8", height: "21.9", x: "93.6", y: "66.1", href: "#dsfr-d" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "14.8", height: "15.5", x: "77.2", y: "72.5", href: "#dsfr-e" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "12", height: "15.5", x: "65.7", y: "72.5", href: "#dsfr-f" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11", height: "15.5", x: "54.3", y: "72.5", href: "#dsfr-a" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11.5", height: "19", x: "43.7", y: "69", href: "#dsfr-c" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "14.7", height: "16.2", x: "28.9", y: "71.8", href: "#dsfr-g" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "12", height: "15.5", x: "19.6", y: "72.5", href: "#dsfr-f" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "21.9", height: "19.8", y: "67.6", href: "#dsfr-h" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "12.4", height: "21.8", x: "77.3", y: "33.1", href: "#dsfr-b" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11.5", height: "19", x: "66.8", y: "36", href: "#dsfr-c" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "9.8", height: "21.9", x: "58.2", y: "33", href: "#dsfr-d" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "10.1", height: "21.9", x: "49.4", y: "33.1", href: "#dsfr-i" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "14.7", height: "16.2", x: "34.9", y: "38.8", href: "#dsfr-g" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "18", height: "22", x: "18.6", y: "39.4", href: "#dsfr-j" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "23", height: "25.1", y: "29.3", href: "#dsfr-k" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "12.4", height: "21.8", x: "76.8", y: ".1", href: "#dsfr-b" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11.5", height: "19", x: "66.2", y: "2.9", href: "#dsfr-c" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "12", height: "15.5", x: "54.8", y: "6.5", href: "#dsfr-f" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "11", height: "15.5", x: "43.4", y: "6.4", href: "#dsfr-a" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "13.6", height: "21.8", x: "29.4", y: ".1", href: "#dsfr-l" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "9.8", height: "21.9", x: "20.6", href: "#dsfr-d" }),
+          /* @__PURE__ */ jsxRuntime.jsx("use", { width: "19.2", height: "19.9", y: "1.4", href: "#dsfr-m" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("use", { fill: "currentColor", width: "126", height: "90", x: "0", y: "0", href: "#dsfr-n" }),
+      /* @__PURE__ */ jsxRuntime.jsx("use", { fill: "#fff", width: "126", height: "90", x: "126", y: "90", href: "#dsfr-n" })
+    ]
+  }
+));
+MottoSvg.displayName = "MottoSvg";
+var sizeConfig = {
+  sm: { fontSize: 12.6, marianneW: 34.65, marianneH: 12.6, mottoW: 33.075, mottoH: 23.625 },
+  md: { fontSize: 16.8, marianneW: 46.2, marianneH: 16.8, mottoW: 44.1, mottoH: 31.5 },
+  lg: { fontSize: 21, marianneW: 57.75, marianneH: 21, mottoW: 55.125, mottoH: 39.375 }
+};
+var Logo = React__namespace.forwardRef(
+  ({ className, size, showMotto = true, serviceTitle, alt = "R\xE9publique\nFran\xE7aise", ...props }, ref) => {
+    const s = sizeConfig[size || "md"];
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "p",
+      {
+        ref,
+        className: cn(
+          "inline-block font-bold uppercase leading-[1.03] tracking-[-0.01em]",
+          size === "sm" && "text-[12.6px]",
+          size === "lg" && "text-[21px]",
+          (!size || size === "md") && "text-[16.8px]",
+          className
+        ),
+        role: "img",
+        "aria-label": alt.replace("\n", " "),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "block",
+              "aria-hidden": "true",
+              style: {
+                width: s.marianneW,
+                height: s.marianneH * 1.125,
+                marginBottom: s.fontSize / 3,
+                background: "linear-gradient(90deg, #000091 0%, #000091 50%, #e1000f 50%, #e1000f 100%)",
+                backgroundSize: `100% ${s.marianneH / (s.marianneH * 1.125) * 100}%`,
+                backgroundRepeat: "no-repeat",
+                backgroundPosition: "0 100%"
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(MarianneSvg, {})
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "R\xE9publique Fran\xE7aise" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "text-foreground inline-block leading-[1.15em] mt-[0.2em]",
+              "aria-hidden": "true",
+              style: { fontFamily: "Marianne, arial, sans-serif" },
+              children: serviceTitle ? typeof serviceTitle === "string" ? serviceTitle.split("\n").map((line, i, arr) => /* @__PURE__ */ jsxRuntime.jsxs(React__namespace.Fragment, { children: [
+                line,
+                i < arr.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("br", {})
+              ] }, i)) : serviceTitle : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                "R\xE9publique",
+                /* @__PURE__ */ jsxRuntime.jsx("br", {}),
+                "Fran\xE7aise"
+              ] })
+            }
+          ),
+          showMotto && /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "block text-foreground mt-[0.2em]",
+              "aria-hidden": "true",
+              style: {
+                width: s.mottoW,
+                height: s.mottoH
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(MottoSvg, {})
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Logo.displayName = "Logo";
+var ServiceLogo = React__namespace.forwardRef(
+  ({ className, serviceName, serviceTagline, logoUrl, logoAlt, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn("flex items-center gap-4 border-l-2 border-primary pl-4", className),
+      ...props,
+      children: [
+        logoUrl && /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoUrl, alt: logoAlt || serviceName, className: "h-12 w-auto" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-bold text-foreground", children: serviceName }),
+          serviceTagline && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: serviceTagline })
+        ] })
+      ]
+    }
+  )
+);
+ServiceLogo.displayName = "ServiceLogo";
+
+exports.Logo = Logo;
+exports.ServiceLogo = ServiceLogo;
+exports.logoVariants = logoVariants;

package/dist/components/ui/logo.mjs

@@ -0,0 +1,2 @@
+export { Logo, ServiceLogo, logoVariants } from '../../chunk-EA3TIJMP.mjs';
+import '../../chunk-SZOFVBTZ.mjs';

package/dist/components/ui/modal.d.mts

@@ -0,0 +1,34 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * Composant Modal (Dialog) DSFR
+ * Utilise Radix UI Dialog pour l'accessibilité
+ * Conforme au design system : https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/modale
+ */
+declare const Modal: React.FC<DialogPrimitive.DialogProps>;
+declare const ModalTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const ModalPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const ModalClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const ModalOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const modalContentVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xl" | "full" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ModalContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof modalContentVariants> {
+}
+declare const ModalContent: React.ForwardRefExoticComponent<ModalContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const ModalHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const ModalFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const ModalTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const ModalDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+
+export { Modal, ModalClose, ModalContent, type ModalContentProps, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger };

package/dist/components/ui/modal.d.ts

@@ -0,0 +1,34 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * Composant Modal (Dialog) DSFR
+ * Utilise Radix UI Dialog pour l'accessibilité
+ * Conforme au design system : https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/modale
+ */
+declare const Modal: React.FC<DialogPrimitive.DialogProps>;
+declare const ModalTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const ModalPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const ModalClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const ModalOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const modalContentVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xl" | "full" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ModalContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof modalContentVariants> {
+}
+declare const ModalContent: React.ForwardRefExoticComponent<ModalContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const ModalHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const ModalFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const ModalTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const ModalDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+
+export { Modal, ModalClose, ModalContent, type ModalContentProps, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger };