@lab-anssi/ui-kit 1.24.0 → 1.25.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/README.md +62 -22
  2. package/dist/Alerte.svelte +3 -5
  3. package/dist/Alerte.svelte.d.ts +7 -19
  4. package/dist/CentreAide.svelte +10 -10
  5. package/dist/CentreAide.svelte.d.ts +24 -21
  6. package/dist/composants/AncresParcours.svelte +1050 -0
  7. package/dist/composants/AncresParcours.svelte.d.ts +11 -0
  8. package/dist/composants/FiltresCatalogue.svelte +1069 -0
  9. package/dist/composants/FiltresCatalogue.svelte.d.ts +14 -0
  10. package/dist/composants/Hero.svelte +1073 -0
  11. package/dist/composants/Hero.svelte.d.ts +13 -0
  12. package/dist/dsfr/DsfrAlert.svelte +50 -0
  13. package/dist/dsfr/DsfrAlert.svelte.d.ts +17 -0
  14. package/dist/dsfr/DsfrBadge.svelte +47 -0
  15. package/dist/dsfr/DsfrBadge.svelte.d.ts +16 -0
  16. package/dist/dsfr/DsfrButton.svelte +1270 -0
  17. package/dist/dsfr/DsfrButton.svelte.d.ts +20 -0
  18. package/dist/dsfr/DsfrContainer.svelte +15 -0
  19. package/dist/dsfr/DsfrContainer.svelte.d.ts +13 -0
  20. package/dist/index.d.ts +7 -0
  21. package/dist/index.js +7 -0
  22. package/dist/lab/Bouton.svelte +10 -8
  23. package/dist/lab/Bouton.svelte.d.ts +11 -23
  24. package/dist/lab/Icone.svelte +669 -2
  25. package/dist/lab/Icone.svelte.d.ts +6 -18
  26. package/dist/lab/Lien.svelte +13 -49
  27. package/dist/lab/Lien.svelte.d.ts +14 -26
  28. package/dist/lab/ResumePssi.svelte +1 -1
  29. package/dist/lab/ResumePssi.svelte.d.ts +5 -17
  30. package/dist/lab/Tag.svelte +10 -8
  31. package/dist/lab/Tag.svelte.d.ts +10 -22
  32. package/dist/lab/blog/BandeauTitre.svelte +5 -8
  33. package/dist/lab/blog/BandeauTitre.svelte.d.ts +9 -21
  34. package/dist/lab/blog/CarteArticle.svelte +2 -3
  35. package/dist/lab/blog/CarteArticle.svelte.d.ts +6 -18
  36. package/dist/lab/blog/IconeChevronBas.svelte.d.ts +22 -21
  37. package/dist/lab/blog/IconeMenuLateral.svelte.d.ts +22 -21
  38. package/dist/lab/blog/ListeArticles.svelte +5 -5
  39. package/dist/lab/blog/ListeArticles.svelte.d.ts +7 -19
  40. package/dist/lab/blog/ListeDeroulante.svelte +3 -4
  41. package/dist/lab/blog/ListeDeroulante.svelte.d.ts +9 -21
  42. package/dist/lab/blog/PageCrisp.svelte +10 -6
  43. package/dist/lab/blog/PageCrisp.svelte.d.ts +6 -18
  44. package/dist/lab/blog/SommaireBureau.svelte +3 -3
  45. package/dist/lab/blog/SommaireBureau.svelte.d.ts +21 -18
  46. package/dist/lab/blog/SommaireMobile.svelte +5 -5
  47. package/dist/lab/blog/SommaireMobile.svelte.d.ts +21 -18
  48. package/dist/lab/icones/Fleche.svelte +1 -1
  49. package/dist/lab/icones/Fleche.svelte.d.ts +5 -17
  50. package/dist/lab/icones/LienExterne.svelte +1 -1
  51. package/dist/lab/icones/LienExterne.svelte.d.ts +5 -17
  52. package/dist/lab/vitrines-produits/briques/Brique.svelte +7 -4
  53. package/dist/lab/vitrines-produits/briques/Brique.svelte.d.ts +8 -21
  54. package/dist/lab/vitrines-produits/briques/BriqueContenuADeuxColonnes.svelte +11 -9
  55. package/dist/lab/vitrines-produits/briques/BriqueContenuADeuxColonnes.svelte.d.ts +9 -21
  56. package/dist/lab/vitrines-produits/briques/BriqueHero.svelte +15 -11
  57. package/dist/lab/vitrines-produits/briques/BriqueHero.svelte.d.ts +11 -23
  58. package/dist/lab/vitrines-produits/briques/BriqueTitreMultimedia.svelte +2 -3
  59. package/dist/lab/vitrines-produits/briques/BriqueTitreMultimedia.svelte.d.ts +6 -18
  60. package/dist/lab/vitrines-produits/briques/CarrouselTuiles/CarrouselTuiles.svelte +5 -5
  61. package/dist/lab/vitrines-produits/briques/CarrouselTuiles/CarrouselTuiles.svelte.d.ts +6 -18
  62. package/dist/lab/vitrines-produits/briques/CarrouselTuiles/IconeFlecheDroite.svelte.d.ts +22 -21
  63. package/dist/lab/vitrines-produits/briques/CarrouselTuiles/IconeFlecheGauche.svelte.d.ts +22 -21
  64. package/dist/lab/vitrines-produits/briques/LecteurVideo.svelte +1 -4
  65. package/dist/lab/vitrines-produits/briques/LecteurVideo.svelte.d.ts +8 -20
  66. package/dist/lab/vitrines-produits/briques/PresentationANSSI.svelte +1 -1
  67. package/dist/lab/vitrines-produits/briques/PresentationANSSI.svelte.d.ts +16 -14
  68. package/dist/lab/vitrines-produits/briques/RejoindreLaCommunaute.svelte +2 -5
  69. package/dist/lab/vitrines-produits/briques/RejoindreLaCommunaute.svelte.d.ts +8 -20
  70. package/dist/lab/vitrines-produits/briques/Tuile.svelte +1 -4
  71. package/dist/lab/vitrines-produits/briques/Tuile.svelte.d.ts +9 -21
  72. package/dist/lab/vitrines-produits/briques/marelle/Etape.svelte +2 -3
  73. package/dist/lab/vitrines-produits/briques/marelle/Etape.svelte.d.ts +6 -18
  74. package/dist/lab/vitrines-produits/briques/marelle/Marelle.svelte +2 -4
  75. package/dist/lab/vitrines-produits/briques/marelle/Marelle.svelte.d.ts +7 -19
  76. package/dist/lab/vitrines-produits/briques/temoignages/IconeTemoignage.svelte.d.ts +22 -21
  77. package/dist/lab/vitrines-produits/briques/temoignages/Temoignages.svelte +12 -11
  78. package/dist/lab/vitrines-produits/briques/temoignages/Temoignages.svelte.d.ts +6 -18
  79. package/dist/mes-services-cyber/bandeau/Bandeau.svelte +5 -3
  80. package/dist/mes-services-cyber/bandeau/Bandeau.svelte.d.ts +3 -16
  81. package/dist/mes-services-cyber/lien/LienDiagnosticCyber.svelte +2 -3
  82. package/dist/mes-services-cyber/lien/LienDiagnosticCyber.svelte.d.ts +6 -18
  83. package/dist/pied-de-page/NavigationPiedDePage.svelte +1 -1
  84. package/dist/pied-de-page/NavigationPiedDePage.svelte.d.ts +5 -17
  85. package/dist/styles/mixins.scss +17 -0
  86. package/dist/suite-cyber/navigation/AccueilMSC.svelte +1 -1
  87. package/dist/suite-cyber/navigation/AccueilMSC.svelte.d.ts +16 -14
  88. package/dist/suite-cyber/navigation/BlocLiens.svelte +1 -2
  89. package/dist/suite-cyber/navigation/BlocLiens.svelte.d.ts +12 -23
  90. package/dist/suite-cyber/navigation/Navigation.svelte +5 -5
  91. package/dist/suite-cyber/navigation/Navigation.svelte.d.ts +5 -17
  92. package/dist/{types.d.ts → types/commun.d.ts} +5 -10
  93. package/dist/types/commun.js +1 -0
  94. package/dist/types/global.d.ts +22 -0
  95. package/dist/types/global.js +9 -0
  96. package/dist/types/index.d.ts +2 -0
  97. package/dist/types/index.js +1 -0
  98. package/dist/utilitaires/index.d.ts +6 -0
  99. package/dist/utilitaires/index.js +12 -0
  100. package/dist/webcomponents/lab-anssi-ui-kit.iife.js +238 -41
  101. package/dist/webcomponents/lab-anssi-ui-kit.jsx.d.ts +27 -85
  102. package/package.json +39 -38
  103. package/dist/generateurImagesPlaceholders.d.ts +0 -1
  104. package/dist/generateurImagesPlaceholders.js +0 -3
  105. package/dist/types.js +0 -1
@@ -0,0 +1,13 @@
1
+ import type { Snippet } from "svelte";
2
+ interface Props {
3
+ titre: string;
4
+ baliseTitre: string;
5
+ description: string;
6
+ actions?: Snippet;
7
+ inverse?: boolean;
8
+ urlImage?: string | undefined;
9
+ sansImage?: boolean;
10
+ }
11
+ declare const Hero: import("svelte").Component<Props, {}, "">;
12
+ type Hero = ReturnType<typeof Hero>;
13
+ export default Hero;
@@ -0,0 +1,50 @@
1
+ <svelte:options
2
+ customElement={{
3
+ tag: "dsfr-alert",
4
+ shadow: "none",
5
+ props: {
6
+ buttonCloseLabel: { attribute: "button-close-label", type: "String" },
7
+ hasTitle: { attribute: "has-title", type: "Boolean" },
8
+ title: { attribute: "title", type: "String" },
9
+ hasDescription: { attribute: "has-description", type: "Boolean" },
10
+ text: { attribute: "text", type: "String" },
11
+ type: { attribute: "type", type: "String" },
12
+ size: { attribute: "size", type: "String" },
13
+ id: { attribute: "id", type: "String" },
14
+ dismissible: { attribute: "dismissible", type: "Boolean" },
15
+ icon: { attribute: "icon", type: "String" },
16
+ },
17
+ }}
18
+ />
19
+
20
+ <script lang="ts">import { setIconClass } from "../utilitaires";
21
+ let {
22
+ hasTitle = true,
23
+ hasDescription = true,
24
+ title,
25
+ text,
26
+ type = "default",
27
+ size = "md",
28
+ id,
29
+ icon,
30
+ dismissible = false,
31
+ buttonCloseLabel
32
+ } = $props();
33
+ let iconClass = $derived(setIconClass(icon));
34
+ let typeClass = $derived(`fr-alert--${type}`);
35
+ let sizeClass = $derived(`fr-alert--${size}`);
36
+ </script>
37
+
38
+ <div {id} class={["fr-alert", iconClass, typeClass, sizeClass]}>
39
+ {#if hasTitle || size === "md"}
40
+ <h3 class="fr-alert__title">{title}</h3>
41
+ {/if}
42
+ {#if hasDescription || size === "sm"}
43
+ <p>{text}</p>
44
+ {/if}
45
+ {#if dismissible}
46
+ <button title={buttonCloseLabel} type="button" class="fr-btn--close fr-btn">
47
+ {buttonCloseLabel}
48
+ </button>
49
+ {/if}
50
+ </div>
@@ -0,0 +1,17 @@
1
+ import type { Size } from "../types";
2
+ type AlertSize = Extract<Size, "sm" | "md">;
3
+ interface Props {
4
+ buttonCloseLabel?: string;
5
+ hasTitle?: boolean;
6
+ title?: string;
7
+ hasDescription?: boolean;
8
+ text?: string;
9
+ type?: "default" | "success" | "error" | "info" | "warning";
10
+ size?: AlertSize;
11
+ id?: string;
12
+ dismissible?: boolean;
13
+ icon?: string;
14
+ }
15
+ declare const DsfrAlert: import("svelte").Component<Props, {}, "">;
16
+ type DsfrAlert = ReturnType<typeof DsfrAlert>;
17
+ export default DsfrAlert;
@@ -0,0 +1,47 @@
1
+ <svelte:options
2
+ customElement={{
3
+ tag: "dsfr-badge",
4
+ shadow: "none",
5
+ props: {
6
+ label: { attribute: "label", type: "String" },
7
+ accent: { attribute: "accent", type: "String" },
8
+ ellipsis: { attribute: "ellipsis", type: "Boolean" },
9
+ hasIcon: { attribute: "has-icon", type: "Boolean" },
10
+ icon: { attribute: "icon", type: "String" },
11
+ size: { attribute: "size", type: "String" },
12
+ status: { attribute: "status", type: "String" },
13
+ type: { attribute: "type", type: "String" },
14
+ },
15
+ }}
16
+ />
17
+
18
+ <script lang="ts">import { setIconClass } from "../utilitaires";
19
+ let {
20
+ accent,
21
+ ellipsis = false,
22
+ hasIcon = false,
23
+ icon,
24
+ label,
25
+ size,
26
+ status,
27
+ type
28
+ } = $props();
29
+ let accentClass = $derived.by(() => {
30
+ return type === "accent" && accent && `fr-badge--${accent}`;
31
+ });
32
+ let iconClass = $derived.by(() => {
33
+ return hasIcon && icon && `fr-badge--icon-left ${setIconClass(icon)}`;
34
+ });
35
+ let sizeClass = $derived(`fr-badge--${size}`);
36
+ let statusClass = $derived.by(() => {
37
+ return type === "status" && status && `fr-badge--${status}`;
38
+ });
39
+ </script>
40
+
41
+ <p class={["fr-badge", accentClass, iconClass, sizeClass, statusClass]}>
42
+ {#if ellipsis}
43
+ <span class="fr-ellipsis">{label}</span>
44
+ {:else}
45
+ {label}
46
+ {/if}
47
+ </p>
@@ -0,0 +1,16 @@
1
+ import type { Accent, Size, Status } from "../types";
2
+ type BadgeSize = Extract<Size, "sm" | "md">;
3
+ type BadgeType = "default" | "accent" | "status";
4
+ interface Props {
5
+ label: string;
6
+ accent?: Accent;
7
+ ellipsis?: boolean;
8
+ hasIcon?: boolean;
9
+ icon?: string;
10
+ size?: BadgeSize;
11
+ status?: Status;
12
+ type?: BadgeType;
13
+ }
14
+ declare const DsfrBadge: import("svelte").Component<Props, {}, "">;
15
+ type DsfrBadge = ReturnType<typeof DsfrBadge>;
16
+ export default DsfrBadge;