@lab-anssi/ui-kit 1.60.10 → 1.61.0

package/README.md

@@ -93,15 +93,14 @@ Une fois cet import effectué, les WebComponents sont prêts à être consommés
 ## Release
 
 - Mettre à jour le `package.json` avec la nouvelle version
-- Exécuter `pnpm install`
 - Faire un commit et une PR `[VERSION] Passe à la version X.X.X`
 - Valider la PR puis la merger
 - Dans `GitHub > Release` cliquer sur le bouton `Draft a new release`
 - Dans le formulaire `New release` :
   - Dérouler la liste puis cliquer sur `Create new tag`
-  - Nommer le tag `v.X.X.X`
+  - Nommer le tag `vX.X.X`
   - La target reste `main`
-  - Release title : `v.X.X.X`
+  - Release title : `vX.X.X`
   - Release notes : utiliser le template ci-dessous :
 
     ```markdown
@@ -116,6 +115,4 @@ Une fois cet import effectué, les WebComponents sont prêts à être consommés
     - **LAB <NOM_COMPOSANT>** - <DESCRIPTION> – [#<ID_PR>](LIEN_PR)
     ```
 
-  - Cliquer sur `Publish release`
-
-- Aller dans les actions `GitHub > Publication du package sur NPM` et lancer la publication sur la version `vX.X.X`
+  - Cliquer sur `Publish release`, l'action `Publication du package sur NPM` se lance sur la version `vX.X.X` automatiquement.

package/dist/ui-kit-components.json

@@ -1033,7 +1033,7 @@
           "description": "Permet d'utiliser une image personnalisée (ex. <picture>, <svg>, ou <img>) en remplacement de l'image par défaut et des styles associées"
         }
       ],
-      "example": "<dsfr-card\n    src={args.src}\n    alt={args.alt}\n    id={args.id}\n    title={args.title}\n    has-description={args.hasDescription || undefined}\n    description={args.description}\n    has-detail-start={args.hasDetailStart || undefined}\n    detail-start={args.detailStart}\n    has-detail-start-icon={args.hasDetailStartIcon || undefined}\n    detail-start-icon={args.detailStartIcon}\n    has-detail-end={args.hasDetailEnd || undefined}\n    detail-end={args.detailEnd}\n    has-detail-end-icon={args.hasDetailEndIcon || undefined}\n    detail-end-icon={args.detailEndIcon}\n    has-badge={args.hasBadge || undefined}\n    has-tag={args.hasTag || undefined}\n    markup={args.markup}\n    enlarge={args.enlarge || undefined}\n    action-markup={args.actionMarkup}\n    action-title={args.actionTitle}\n    href={args.href}\n    blank={args.blank || undefined}\n    no-link={args.noLink || undefined}\n    disabled={args.disabled || undefined}\n    size={args.size}\n    horizontal={args.horizontal || undefined}\n    horizontal-proportion={args.horizontalProportion}\n    has-header-badge={args.hasHeaderBadge || undefined}\n    image-ratio={args.imageRatio}\n    has-buttons={args.hasButtons || undefined}\n    has-links={args.hasLinks || undefined}\n    variations={args.variations}\n    download={args.download || undefined}\n    has-download-icon={args.hasDownloadIcon || undefined}\n    no-icon={args.noIcon || undefined}\n    lang={args.lang}\n  >\n    <!-- Badges Group (slot: badgesgroup) -->\n    <dsfr-badges-group\n      slot=\"badgesgroup\"\n      badges={[{ label: \"Libellé badge\", accent: \"purple-glycine\" }]}\n      size=\"sm\"\n    ></dsfr-badges-group>\n\n    <!-- Badges Group (slot: headerbadges) -->\n    <dsfr-badges-group\n      slot=\"headerbadges\"\n      badges={[{ label: \"Libellé badge\", accent: \"purple-glycine\" }]}\n      size=\"sm\"\n    ></dsfr-badges-group>\n\n    <!-- Tags Group (slot: tagsgroup) -->\n    <dsfr-tags-group\n      slot=\"tagsgroup\"\n      tags={[{ id: \"tag-1\", label: \"Libellé du tag\" }]}\n      size=\"sm\"\n      groupMarkup=\"div\"\n    ></dsfr-tags-group>\n\n    <!-- Tags Group (slot: contentend) -->\n    <dsfr-tags-group\n      slot=\"contentend\"\n      tags={[{ id: \"tag-1\", label: \"Libellé du tag\" }]}\n      size=\"sm\"\n      groupMarkup=\"div\"\n    ></dsfr-tags-group>\n\n    <!-- Buttons Group (slot: buttonsgroup) -->\n    <dsfr-buttons-group slot=\"buttonsgroup\" buttons={args.buttons}></dsfr-buttons-group>\n  </dsfr-card>"
+      "example": "<dsfr-card\n    src={args.src}\n    alt={args.alt}\n    id={args.id}\n    title={args.title}\n    has-description={args.hasDescription || undefined}\n    description={args.description}\n    has-detail-start={args.hasDetailStart || undefined}\n    detail-start={args.detailStart}\n    has-detail-start-icon={args.hasDetailStartIcon || undefined}\n    detail-start-icon={args.detailStartIcon}\n    has-detail-end={args.hasDetailEnd || undefined}\n    detail-end={args.detailEnd}\n    has-detail-end-icon={args.hasDetailEndIcon || undefined}\n    detail-end-icon={args.detailEndIcon}\n    has-badge={args.hasBadge || undefined}\n    has-tag={args.hasTag || undefined}\n    markup={args.markup}\n    enlarge={args.enlarge || undefined}\n    action-markup={args.actionMarkup}\n    action-title={args.actionTitle}\n    href={args.href}\n    blank={args.blank || undefined}\n    no-link={args.noLink || undefined}\n    disabled={args.disabled || undefined}\n    size={args.size}\n    horizontal={args.horizontal || undefined}\n    horizontal-proportion={args.horizontalProportion}\n    has-header-badge={args.hasHeaderBadge || undefined}\n    image-ratio={args.imageRatio}\n    has-buttons={args.hasButtons || undefined}\n    has-links={args.hasLinks || undefined}\n    variations={args.variations}\n    download={args.download || undefined}\n    has-download-icon={args.hasDownloadIcon || undefined}\n    no-icon={args.noIcon || undefined}\n    lang={args.lang}\n  >\n    <!-- Badges Group (slot: badgesgroup) -->\n    <dsfr-badges-group\n      slot=\"badgesgroup\"\n      badges={[\n        { label: \"Libellé badge\", accent: \"purple-glycine\" },\n        { label: \"Libellé badge\", accent: \"purple-glycine\" },\n      ]}\n      size={args.size}\n    ></dsfr-badges-group>\n\n    <!-- Badges Group (slot: headerbadges) -->\n    <dsfr-badges-group\n      slot=\"headerbadges\"\n      badges={[\n        { label: \"Libellé badge\", accent: \"purple-glycine\" },\n        { label: \"Libellé badge\", accent: \"purple-glycine\" },\n      ]}\n      size={args.size}\n    ></dsfr-badges-group>\n\n    <!-- Tags Group (slot: tagsgroup) -->\n    <dsfr-tags-group\n      slot=\"tagsgroup\"\n      tags={[\n        { id: \"tag-1\", label: \"Libellé du tag\" },\n        { id: \"tag-2\", label: \"Libellé du tag\" },\n      ]}\n      size={args.size}\n      group-markup=\"div\"\n    ></dsfr-tags-group>\n\n    <!-- Tags Group (slot: contentend) -->\n    {#if args.hasContentEnd}\n      <dsfr-tags-group\n        slot=\"contentend\"\n        tags={[{ id: \"tag-1\", label: \"Libellé du tag\" }]}\n        size={args.size}\n        group-markup=\"div\"\n      ></dsfr-tags-group>\n    {/if}\n\n    <!-- Buttons Group (slot: buttonsgroup) -->\n    <dsfr-buttons-group slot=\"buttonsgroup\" buttons={args.buttons}></dsfr-buttons-group>\n  </dsfr-card>"
     },
     {
       "tagName": "dsfr-checkbox",
@@ -4162,9 +4162,52 @@
       ],
       "example": "<dsfr-select\n    id={args.id}\n    label={args.label}\n    value={args.value}\n    grouped-options={args.groupedOptions || undefined}\n    options={args.options}\n    option-groups={args.optionGroups}\n    hint={args.hint}\n    placeholder={args.placeholder}\n    placeholder-disabled={args.placeholderDisabled || undefined}\n    disabled={args.disabled || undefined}\n    status={args.status}\n    error-message={args.errorMessage}\n    valid-message={args.validMessage}\n    info-message={args.infoMessage}\n    form={args.form}\n    required={args.required || undefined}\n    label-size={args.labelSize}\n    label-weight={args.labelWeight}\n    hide-label={args.hideLabel || undefined}\n  ></dsfr-select>"
     },
+    {
+      "tagName": "dsfr-share",
+      "title": "Composants/DSFR/Share",
+      "source": "src/lib/dsfr/DsfrShare.svelte",
+      "props": [
+        {
+          "name": "title",
+          "attribute": "title",
+          "type": "String",
+          "tsType": "string",
+          "description": "Titre du bloc de partage"
+        },
+        {
+          "name": "buttons",
+          "attribute": "buttons",
+          "type": "Object",
+          "tsType": "ShareButton[]",
+          "description": "Liste des boutons de partage"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "type": "Boolean",
+          "tsType": "boolean",
+          "description": "Désactive les boutons sociaux (consentement cookies)"
+        },
+        {
+          "name": "text",
+          "attribute": "text",
+          "type": "String",
+          "tsType": "string",
+          "description": "Texte informatif affiché quand disabled est vrai. Utiliser le slot `text` pour du contenu riche (ex: liens)."
+        }
+      ],
+      "events": [],
+      "slots": [
+        {
+          "name": "text",
+          "description": "Contenu personnalisé du texte informatif, permettant d'utiliser des composants riches (ex: `DsfrLink`). Remplace la prop `text`."
+        }
+      ],
+      "example": "<dsfr-share\n    title={args.title}\n    buttons={args.buttons}\n    disabled={args.disabled || undefined}\n    text={args.text}\n  >\n    {#if args.hasText}\n      <span slot=\"text\">\n        Veuillez <DsfrLink neutral href=\"#\" label=\"autoriser le dépôt de cookies\" /> pour partager sur\n        Facebook, Twitter, Bluesky et LinkedIn.\n      </span>\n    {/if}\n  </dsfr-share>"
+    },
     {
       "tagName": "dsfr-side-menu",
-      "title": "Composants/DSFR/Side Menu",
+      "title": "Composants/DSFR/Sidemenu",
       "source": "src/lib/dsfr/DsfrSideMenu.svelte",
       "props": [
         {
@@ -4232,11 +4275,11 @@
       ],
       "events": [],
       "slots": [],
-      "example": "<div style=\"width: 300px\">\n    <dsfr-side-menu\n      title={args.title}\n      items={args.items}\n      button-label={args.buttonLabel}\n      button-id={args.buttonId}\n      title-id={args.titleId}\n      has-title={args.hasTitle || undefined}\n      modifier={args.modifier}\n      active-item={args.activeItem}\n    ></dsfr-side-menu>\n  </div>"
+      "example": "<dsfr-side-menu\n    title={args.title}\n    items={args.items}\n    button-label={args.buttonLabel}\n    button-id={args.buttonId}\n    title-id={args.titleId}\n    has-title={args.hasTitle || undefined}\n    modifier={args.modifier}\n    active-item={args.activeItem}\n  ></dsfr-side-menu>"
     },
     {
       "tagName": "dsfr-skiplink",
-      "title": "Composants/DSFR/SkipLink",
+      "title": "Composants/DSFR/Skiplink",
       "source": "src/lib/dsfr/DsfrSkipLink.svelte",
       "props": [
         {
@@ -4651,7 +4694,7 @@
     },
     {
       "tagName": "dsfr-tabs",
-      "title": "Composants/DSFR/Tabs",
+      "title": "Composants/DSFR/Tab",
       "source": "src/lib/dsfr/DsfrTabs.svelte",
       "props": [
         {
@@ -4690,7 +4733,7 @@
         }
       ],
       "slots": [],
-      "example": "<dsfr-tabs\n    tabs={tabsProps(args).tabs}\n    aria-label=\"Exemple d'onglets\"\n    has-icon={args.hasIcon || undefined}\n  >\n  </dsfr-tabs>"
+      "example": "{@const props = tabsProps($state.snapshot(args))}\n  <dsfr-tabs tabs={props.tabs} aria-label=\"Exemple d'onglets\" has-icon={args.hasIcon || undefined}>\n  </dsfr-tabs>"
     },
     {
       "tagName": "dsfr-tag",

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@lab-anssi/ui-kit",
-  "version": "1.60.10",
+  "version": "1.61.0",
   "framework-config": {
     "enable-when": {
       "file-extensions": [
@@ -6083,6 +6083,70 @@
             }
           ]
         },
+        {
+          "name": "dsfr-share",
+          "attributes": [
+            {
+              "name": "title",
+              "description": "Titre du bloc de partage",
+              "value": {
+                "type": "string"
+              }
+            },
+            {
+              "name": "buttons",
+              "description": "Liste des boutons de partage",
+              "value": {
+                "type": "string"
+              }
+            },
+            {
+              "name": "disabled",
+              "description": "Désactive les boutons sociaux (consentement cookies)",
+              "value": {
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "text",
+              "description": "Texte informatif affiché quand disabled est vrai. Utiliser le slot `text` pour du contenu riche (ex: liens).",
+              "value": {
+                "type": "string"
+              }
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "title",
+                "description": "Titre du bloc de partage",
+                "type": "string"
+              },
+              {
+                "name": "buttons",
+                "description": "Liste des boutons de partage",
+                "type": "string"
+              },
+              {
+                "name": "disabled",
+                "description": "Désactive les boutons sociaux (consentement cookies)",
+                "type": "boolean"
+              },
+              {
+                "name": "text",
+                "description": "Texte informatif affiché quand disabled est vrai. Utiliser le slot `text` pour du contenu riche (ex: liens).",
+                "type": "string"
+              }
+            ]
+          },
+          "doc-url": "https://betagouv.github.io/lab-anssi-ui-kit/?path=/docs/composants-dsfr-share--docs",
+          "slots": [
+            {
+              "name": "text",
+              "description": "Contenu personnalisé du texte informatif, permettant d'utiliser des composants riches (ex: `DsfrLink`). Remplace la prop `text`."
+            }
+          ]
+        },
         {
           "name": "dsfr-side-menu",
           "attributes": [
@@ -6187,7 +6251,7 @@
               }
             ]
           },
-          "doc-url": "https://betagouv.github.io/lab-anssi-ui-kit/?path=/docs/composants-dsfr-side-menu--docs"
+          "doc-url": "https://betagouv.github.io/lab-anssi-ui-kit/?path=/docs/composants-dsfr-sidemenu--docs"
         },
         {
           "name": "dsfr-skiplink",
@@ -6969,7 +7033,7 @@
               }
             ]
           },
-          "doc-url": "https://betagouv.github.io/lab-anssi-ui-kit/?path=/docs/composants-dsfr-tabs--docs",
+          "doc-url": "https://betagouv.github.io/lab-anssi-ui-kit/?path=/docs/composants-dsfr-tab--docs",
           "events": [
             {
               "name": "tabchanged",