@supersoniks/concorde 5.0.2 → 5.0.3

package/docs/crawl/core/components/ui/button/button.html

@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/button/button.html" data-doc-id="core/components/ui/button/button">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Button — Concorde</title>
+  <meta name="description" content="The length of the button depends on the size of its content">
+  <meta name="keywords" content="Concorde, supersoniks, core/components/ui/button/button, button, Button, UI component, sonic-button, web component">
+  <meta name="concorde-doc-id" content="core/components/ui/button/button">
+  <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/button/button.html">
+</head>
+<body>
+  <header>
+    <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/button/button.md/button" rel="nofollow">interactive version</a></p>
+  </header>
+  <main>
+    <article>
+      <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Button</strong>. The length of the button depends on the size of its content <span>Doc ID: <code>core/components/ui/button/button</code>. Keywords: Concorde, supersoniks, core/components/ui/button/button, button, Button, UI component, sonic-button, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/button/button.html">https://concorde.supersoniks.org/crawl/core/components/ui/button/button.html</a>.</span></p>
+      <h1 id="button">Button</h1>
+<h2 id="type">Type</h2>
+<pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
+      &lt;sonic-button&gt;Default&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;primary&quot;&gt;Primary&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;neutral&quot;&gt;Neutral&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;warning&quot;&gt;Warning&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;info&quot;&gt;Info&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;success&quot;&gt;Success&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;danger&quot;&gt;Danger&lt;/sonic-button&gt;
+      &lt;sonic-button type=&quot;custom&quot; style=&quot;--sc-btn-custom-color: #fde68a; --sc-btn-custom-bg: #5b21b6&quot;&gt;Custom&lt;/sonic-button&gt;
+    &lt;/div&gt;
+</code></pre>
+<h2 id="outline">Outline</h2>
+<pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
+      &lt;sonic-button variant=&quot;outline&quot;&gt;Default&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;primary&quot;&gt;Primary&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;neutral&quot;&gt;Neutral&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;warning&quot;&gt;Warning&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;info&quot;&gt;Info&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;success&quot;&gt;Success&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;danger&quot;&gt;Danger&lt;/sonic-button&gt;
+      &lt;sonic-button variant=&quot;outline&quot; type=&quot;custom&quot; style=&quot;--sc-btn-custom-bg: #5b21b6&quot;&gt;Custom&lt;/sonic-button&gt;
+    &lt;/div&gt;
+</code></pre>
+<h2 id="variant">Variant</h2>
+<pre><code>&lt;sonic-button variant=&quot;default&quot;&gt;Default&lt;/sonic-button&gt;
+    &lt;sonic-button variant=&quot;outline&quot;&gt;Outline&lt;/sonic-button&gt;
+    &lt;sonic-button variant=&quot;ghost&quot;&gt;Ghost&lt;/sonic-button&gt;
+    &lt;sonic-button variant=&quot;link&quot;&gt;Link&lt;/sonic-button&gt;
+    &lt;sonic-button variant=&quot;unstyled&quot;&gt;Unstyled&lt;/sonic-button&gt;
+</code></pre>
+<h2 id="size">Size</h2>
+<pre><code>&lt;sonic-button size=&quot;2xs&quot;&gt;2Xs button&lt;/sonic-button&gt;
+    &lt;sonic-button size=&quot;xs&quot;&gt;Xs button&lt;/sonic-button&gt;
+    &lt;sonic-button size=&quot;sm&quot;&gt;Sm button&lt;/sonic-button&gt;
+    &lt;sonic-button size=&quot;md&quot;&gt;Md button&lt;/sonic-button&gt;
+    &lt;sonic-button&gt;Default button&lt;/sonic-button&gt;
+    &lt;sonic-button size=&quot;lg&quot;&gt;Lg button&lt;/sonic-button&gt;
+    &lt;sonic-button size=&quot;xl&quot;&gt;Xl button&lt;/sonic-button&gt;
+    &lt;sonic-button size=&quot;2xl&quot;&gt;2Xl button&lt;/sonic-button&gt;
+</code></pre>
+<h2 id="shape">Shape</h2>
+<pre><code>&lt;sonic-button shape=&quot;circle&quot;&gt; 😂 &lt;/sonic-button&gt;
+    &lt;sonic-button shape=&quot;square&quot;&gt; 🚀 &lt;/sonic-button&gt;
+</code></pre>
+<h2 id="loading">Loading</h2>
+<p>The length of the button depends on the size of its content</p>
+<pre><code>&lt;sonic-button loading&gt;&lt;/sonic-button&gt;
+    &lt;sonic-button loading&gt;Loading button&lt;/sonic-button&gt;
+    &lt;sonic-button loading&gt;&lt;span slot=&quot;prefix&quot;&gt;🚀&lt;/span&gt;Loading with prefix&lt;span slot=&quot;suffix&quot;&gt;😂&lt;/span&gt;&lt;/sonic-button&gt;
+</code></pre>
+<h2 id="swap">Swap</h2>
+<pre><code>&lt;sonic-button formDataProvider=&quot;button_swap_example&quot; name=&quot;youpi&quot; value=&quot;youpla&quot; type=&quot;primary&quot; shape=&quot;circle&quot; variant=&quot;outline&quot; class=&quot;mr-4&quot;&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; swap=&quot;on&quot; name=&quot;eye-empty&quot;&gt;&lt;/sonic-icon&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; swap=&quot;off&quot; name=&quot;eye-off&quot;&gt;&lt;/sonic-icon&gt;
+    &lt;/sonic-button&gt;
+    &lt;sonic-button formDataProvider=&quot;button_swap_example&quot; name=&quot;youpi&quot; value=&quot;youpla&quot; type=&quot;primary&quot; variant=&quot;outline&quot;&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; swap=&quot;on&quot; slot=&quot;prefix&quot; name=&quot;eye-empty&quot;&gt;&lt;/sonic-icon&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; swap=&quot;off&quot; slot=&quot;prefix&quot; name=&quot;eye-off&quot;&gt;&lt;/sonic-icon&gt;
+      Révélez
+      &lt;span swap=&quot;off&quot;&gt;...&lt;/span&gt;
+      &lt;span swap=&quot;on&quot;&gt;moi !&lt;/span&gt;
+    &lt;/sonic-button&gt;
+</code></pre>
+<h2 id="reset">Reset</h2>
+<pre><code>&lt;div formDataProvider=&quot;button-reset-demo&quot; class=&quot;mb-2&quot;&gt;
+      &lt;sonic-checkbox name=&quot;aChexbox&quot; value=&quot;AValueToSet&quot;&gt;Set A value&lt;/sonic-checkbox&gt;&lt;br&gt;
+      &lt;sonic-button reset&gt;Reset current formDataProvider&lt;/sonic-button&gt;
+    &lt;/div&gt;
+      &lt;sonic-button reset=&quot;button-reset-demo&quot;&gt;Reset formDataProvider by name&lt;/sonic-button&gt;
+</code></pre>
+<h2 id="goback">GoBack</h2>
+<pre><code>&lt;sonic-button goBack type=&quot;primary&quot; variant=&quot;outline&quot;  class=&quot;mr-4&quot;&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; slot=&quot;prefix&quot; name=&quot;arrow-left&quot;&gt;&lt;/sonic-icon&gt;
+      Retour classique
+    &lt;/sonic-button&gt;
+    &lt;sonic-button goBack=&quot;http://la-billetterie.net&quot; type=&quot;primary&quot; variant=&quot;outline&quot;  class=&quot;mr-4&quot;&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; slot=&quot;prefix&quot; name=&quot;arrow-left&quot;&gt;&lt;/sonic-icon&gt;
+      Retour url prédéfinie
+    &lt;/sonic-button&gt;
+</code></pre>
+<h2 id="button-with-icon">Button with icon</h2>
+<pre><code>&lt;sonic-button goBack type=&quot;primary&quot; variant=&quot;outline&quot;  class=&quot;mr-4&quot;&gt;
+      &lt;sonic-icon library=&quot;iconoir&quot; slot=&quot;prefix&quot; name=&quot;arrow-right&quot; &gt;&lt;/sonic-icon&gt;
+      Button with icon
+    &lt;/sonic-button&gt;
+</code></pre>
+<h2 id="button-group">Button group</h2>
+<pre><code>&lt;sonic-group label=&quot;Code promo&quot; class=&quot;mr-4&quot;&gt;
+      &lt;sonic-input placeholder=&quot;Entrez votre code ici...&quot;&gt;&lt;/sonic-input&gt;
+      &lt;sonic-button type=&quot;primary&quot; shape=&quot;square&quot;&gt;
+        &lt;sonic-icon library=&quot;iconoir&quot; library=&quot;iconoir&quot; name=&quot;gift&quot;&gt;&lt;/sonic-icon&gt;
+      &lt;/sonic-button&gt;
+    &lt;/sonic-group&gt;
+    &lt;sonic-divider size=&quot;lg&quot;&gt;&lt;/sonic-divider&gt;
+    &lt;div class=&quot;text-lg mb-2&quot;&gt;Choose a subscription&lt;/div&gt;
+    &lt;sonic-group formDataProvider=&quot;subscriptionData&quot;&gt;
+      &lt;sonic-button radio minWidth=&quot;10rem&quot; name=&quot;subscription&quot; value=&quot;standard&quot; type=&quot;default&quot;
+        &gt;😎 Standard&lt;/sonic-button
+      &gt;
+      &lt;sonic-button radio minWidth=&quot;10rem&quot; name=&quot;subscription&quot; value=&quot;premium&quot; type=&quot;default&quot;&gt;⭐ Premium&lt;/sonic-button&gt;
+      &lt;sonic-button radio minWidth=&quot;10rem&quot; name=&quot;subscription&quot; value=&quot;diamond&quot; type=&quot;default&quot;&gt;💎 Diamond&lt;/sonic-button&gt;
+    &lt;/sonic-group&gt;
+</code></pre>
+<h2 id="aria-label">Aria-label</h2>
+<pre><code>&lt;sonic-button data-aria-label=&quot;Custom aria label&quot; type=&quot;primary&quot; &gt;
+        Button with aria label
+      &lt;/sonic-button&gt;
+       &lt;sonic-button data-aria-label=&quot;Custom aria label&quot; href=&quot;https://google.fr&quot; type=&quot;primary&quot; &gt;
+        Button link with aria label
+      &lt;/sonic-button&gt;
+</code></pre>
+<h2 id="custom-styles--active-states-with-tailwind">Custom styles &amp; active states with tailwind</h2>
+<pre><code>&lt;div formDataProvider=&quot;subscriptionData2&quot;&gt;
+      &lt;sonic-button
+        class=&quot;bg-neutral-100 transition-all text-center text-lg text-neutral-400 rounded-md min-w-[8rem] [&amp;[active]]:text-danger-content [&amp;[active]]:min-w-[13rem] [&amp;[active]]:bg-danger [&amp;[active]]:font-black [&amp;[active]]:rounded-full&quot;
+        variant=&quot;unstyled&quot;
+        checkable unique 
+        name=&quot;subscription&quot;
+        value=&quot;premium&quot;
+        type=&quot;default&quot;&gt;
+          &lt;span swap=&quot;off&quot; class=&quot;inline-block py-2 px-3&quot; &gt;subscribe&lt;/span&gt;
+          &lt;span swap=&quot;on&quot; class=&quot;inline-block py-2 px-3&quot; &gt;⭐ Premium&lt;/span&gt;
+      &lt;/sonic-button&gt;
+    &lt;/div&gt;
+</code></pre>
+
+    </article>
+  </main>
+</body>
+</html>

package/docs/crawl/core/components/ui/captcha/captcha.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/captcha/captcha.html" data-doc-id="core/components/ui/captcha/captcha">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Captcha — Concorde</title>
+  <meta name="description" content="Captcha: Submit with captcha">
+  <meta name="keywords" content="Concorde, supersoniks, core/components/ui/captcha/captcha, captcha, Captcha, UI component, sonic-captcha, web component">
+  <meta name="concorde-doc-id" content="core/components/ui/captcha/captcha">
+  <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/captcha/captcha.html">
+</head>
+<body>
+  <header>
+    <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/captcha/captcha.md/captcha" rel="nofollow">interactive version</a></p>
+  </header>
+  <main>
+    <article>
+      <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Captcha</strong>. Captcha: Submit with captcha <span>Doc ID: <code>core/components/ui/captcha/captcha</code>. Keywords: Concorde, supersoniks, core/components/ui/captcha/captcha, captcha, Captcha, UI component, sonic-captcha, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/captcha/captcha.html">https://concorde.supersoniks.org/crawl/core/components/ui/captcha/captcha.html</a>.</span></p>
+      <h1 id="captcha">Captcha</h1>
+<pre><code>&lt;sonic-captcha formDataProvider=&quot;captchaTestDataProvider&quot; key=&quot;6Leq5V0iAAAAAB-41DlWN335jDlcIuXmhNtdd00t&quot;&gt;
+    &lt;sonic-submit serviceURL=&quot;/docs-mock-api&quot; endPoint=&quot;api/unknown&quot; onclick&gt;
+      &lt;sonic-button  class=&quot;mt-4&quot;&gt;Submit with captcha&lt;/sonic-button&gt;
+    &lt;/sonic-submit&gt;
+  &lt;/sonic-captcha&gt;
+</code></pre>
+
+    </article>
+  </main>
+</body>
+</html>

package/docs/crawl/core/components/ui/card/card.html

@@ -0,0 +1,143 @@
+<!DOCTYPE html>
+<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/card/card.html" data-doc-id="core/components/ui/card/card">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Card — Concorde</title>
+  <meta name="description" content="A surface for grouped content: padding, radius, shadow, and semantic type colors via shared theme tokens. Compose sonic-card-header, sonic-card-main, and sonic-card-footer inside the card, or put any ">
+  <meta name="keywords" content="Concorde, supersoniks, core/components/ui/card/card, card, Card, UI component, sonic-card, web component, type, sonic-card-header, sonic-card-main, sonic-card-footer, base, light, invert, neutral, primary">
+  <meta name="concorde-doc-id" content="core/components/ui/card/card">
+  <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/card/card.html">
+</head>
+<body>
+  <header>
+    <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/card/card.md/card" rel="nofollow">interactive version</a></p>
+  </header>
+  <main>
+    <article>
+      <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Card</strong>. A surface for grouped content: padding, radius, shadow, and semantic type colors via shared theme tokens. Compose sonic-card-header, sonic-card-main, and sonic-card-footer inside the card, or put any  <span>Doc ID: <code>core/components/ui/card/card</code>. Keywords: Concorde, supersoniks, core/components/ui/card/card, card, Card, UI component, sonic-card, web component, type, sonic-card-header, sonic-card-main, sonic-card-footer, base, light, invert, neutral, primary. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/card/card.html">https://concorde.supersoniks.org/crawl/core/components/ui/card/card.html</a>.</span></p>
+      <h1 id="card">Card</h1>
+<p>A <strong>surface</strong> for grouped content: padding, radius, shadow, and semantic <strong><code>type</code></strong> colors via shared theme tokens. Compose <strong><code>sonic-card-header</code></strong>, <strong><code>sonic-card-main</code></strong>, and <strong><code>sonic-card-footer</code></strong> inside the card, or put any markup in the default slot.</p>
+<p>Default <strong><code>type</code></strong> is <code>base</code> (page background). Use <code>light</code> for a subtle gray panel, <code>invert</code> / <code>neutral</code> for high-contrast blocks, and <code>primary</code>, <code>info</code>, <code>success</code>, <code>warning</code>, or <code>danger</code> for tinted surfaces (divider tokens apply on colored types).</p>
+<h2 id="type">Type</h2>
+<pre><code>&lt;div class=&quot;flex flex-wrap gap-3&quot;&gt;
+      &lt;sonic-card type=&quot;base&quot; class=&quot;min-w-[8rem]&quot;&gt;Base&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;light&quot; class=&quot;min-w-[8rem]&quot;&gt;Light&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;primary&quot; class=&quot;min-w-[8rem]&quot;&gt;Primary&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;info&quot; class=&quot;min-w-[8rem]&quot;&gt;Info&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;success&quot; class=&quot;min-w-[8rem]&quot;&gt;Success&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;warning&quot; class=&quot;min-w-[8rem]&quot;&gt;Warning&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;danger&quot; class=&quot;min-w-[8rem]&quot;&gt;Danger&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;neutral&quot; class=&quot;min-w-[8rem]&quot;&gt;Neutral&lt;/sonic-card&gt;
+      &lt;sonic-card type=&quot;invert&quot; class=&quot;min-w-[8rem]&quot;&gt;Invert&lt;/sonic-card&gt;
+    &lt;/div&gt;
+</code></pre>
+<h2 id="header">Header</h2>
+<p>Quick titles with <strong><code>label</code></strong> and <strong><code>description</code></strong> attributes, or full control through the default slot. <strong><code>slot=&quot;suffix&quot;</code></strong> aligns badges or actions on the right; suffix content does not shrink when the title wraps.</p>
+<pre><code>&lt;div class=&quot;grid gap-4 max-w-xl&quot;&gt;
+      &lt;sonic-card&gt;
+        &lt;sonic-card-header
+          label=&quot;Account settings&quot;
+          description=&quot;Manage your profile and preferences.&quot;
+        &gt;&lt;/sonic-card-header&gt;
+        &lt;p class=&quot;m-0 text-sm opacity-80&quot;&gt;Body content goes in the card slot or in &lt;code&gt;sonic-card-main&lt;/code&gt;.&lt;/p&gt;
+      &lt;/sonic-card&gt;
+
+      &lt;sonic-card type=&quot;neutral&quot;&gt;
+        &lt;sonic-card-header label=&quot;Notifications&quot;&gt;
+          &lt;sonic-card-header-description&gt;
+            Choose what we email you about.
+          &lt;/sonic-card-header-description&gt;
+          &lt;sonic-badge slot=&quot;suffix&quot;  type=&quot;warning&quot; size=&quot;xs&quot;&gt;3 new&lt;/sonic-badge&gt;
+        &lt;/sonic-card-header&gt;
+      &lt;/sonic-card&gt;
+
+      &lt;sonic-card&gt;
+        &lt;sonic-card-header label=&quot;Team workspace&quot; description=&quot;Shared with 12 members&quot;&gt;
+          &lt;sonic-button
+            slot=&quot;suffix&quot;
+            shape=&quot;circle&quot;
+            variant=&quot;outline&quot;
+            size=&quot;sm&quot;
+            type=&quot;default&quot;
+            icon
+            data-aria-label=&quot;Workspace settings&quot;
+          &gt;
+            &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;settings&quot;&gt;&lt;/sonic-icon&gt;
+          &lt;/sonic-button&gt;
+        &lt;/sonic-card-header&gt;
+      &lt;/sonic-card&gt;
+
+      &lt;sonic-card type=&quot;primary&quot;&gt;
+        &lt;sonic-card-header&gt;
+          &lt;div&gt;Custom header&lt;/div&gt;
+          &lt;sonic-card-header-description&gt;
+            Use the header slot when attributes are not enough.
+          &lt;/sonic-card-header-description&gt;
+          &lt;sonic-button slot=&quot;suffix&quot; shape=&quot;circle&quot; variant=&quot;ghost&quot; size=&quot;sm&quot; type=&quot;primary&quot; icon&gt;
+            &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;nav-arrow-right&quot;&gt;&lt;/sonic-icon&gt;
+          &lt;/sonic-button&gt;
+        &lt;/sonic-card-header&gt;
+      &lt;/sonic-card&gt;
+    &lt;/div&gt;
+</code></pre>
+<p><code>label</code> and <code>description</code> accept HTML (rendered as markup). Prefer plain text when possible; use the slot for structured content.</p>
+<h2 id="main">Main</h2>
+<p>Optional wrapper for the primary content area (typography, media, forms).</p>
+<pre><code>&lt;sonic-card class=&quot;max-w-xl&quot;&gt;
+      &lt;sonic-card-header label=&quot;Release notes&quot; description=&quot;Version 2.4&quot;&gt;&lt;/sonic-card-header&gt;
+      &lt;sonic-card-main&gt;
+        &lt;p class=&quot;mt-0&quot;&gt;
+          Improved performance on large lists and fixed an issue with keyboard navigation in menus.
+        &lt;/p&gt;
+        &lt;sonic-divider&gt;&lt;/sonic-divider&gt;
+        &lt;p class=&quot;mb-0 text-sm opacity-80&quot;&gt;See the changelog for details.&lt;/p&gt;
+      &lt;/sonic-card-main&gt;
+    &lt;/sonic-card&gt;
+</code></pre>
+<h2 id="footer">Footer</h2>
+<p>Optional footer for actions, metadata, or secondary text.</p>
+<pre><code>&lt;sonic-card class=&quot;max-w-xl&quot;&gt;
+      &lt;sonic-card-header label=&quot;Confirm deletion&quot;&gt;&lt;/sonic-card-header&gt;
+      &lt;sonic-card-main&gt;
+        &lt;p class=&quot;m-0&quot;&gt;This project and all of its data will be removed permanently.&lt;/p&gt;
+      &lt;/sonic-card-main&gt;
+      &lt;sonic-card-footer&gt;
+      &lt;sonic-divider&gt;&lt;/sonic-divider&gt;
+        &lt;div class=&quot;flex flex-wrap gap-2 justify-end&quot;&gt;
+          &lt;sonic-button variant=&quot;ghost&quot; size=&quot;sm&quot;&gt;Cancel&lt;/sonic-button&gt;
+          &lt;sonic-button type=&quot;danger&quot; size=&quot;sm&quot;&gt;Delete&lt;/sonic-button&gt;
+        &lt;/div&gt;
+      &lt;/sonic-card-footer&gt;
+    &lt;/sonic-card&gt;
+</code></pre>
+<h2 id="full-example">Full example</h2>
+<p>Header, media, body, and footer together.</p>
+<pre><code>&lt;sonic-card class=&quot;max-w-md&quot;&gt;
+      &lt;sonic-card-header label=&quot;Featured route&quot; description=&quot;San Francisco → New York&quot;&gt;
+        &lt;sonic-icon slot=&quot;suffix&quot; library=&quot;iconoir&quot; name=&quot;airplane&quot;&gt;&lt;/sonic-icon&gt;
+      &lt;/sonic-card-header&gt;
+      &lt;sonic-card-main&gt;
+        &lt;sonic-image
+          rounded
+          ratio=&quot;16/9&quot;
+          src=&quot;https://images.unsplash.com/photo-1436491865332-7a61a109cc05?w=800&amp;q=80&quot;
+          alt=&quot;&quot;
+        &gt;&lt;/sonic-image&gt;
+        &lt;p class=&quot;mb-0&quot;&gt;
+          Nonstop flight with flexible dates. Prices shown include taxes and fees.
+        &lt;/p&gt;
+      &lt;/sonic-card-main&gt;
+      &lt;sonic-card-footer&gt;
+        &lt;div class=&quot;flex items-center justify-between gap-3 flex-wrap&quot;&gt;
+          &lt;span class=&quot;text-sm font-semibold&quot;&gt;From $249&lt;/span&gt;
+          &lt;sonic-button type=&quot;primary&quot; size=&quot;sm&quot;&gt;Book&lt;/sonic-button&gt;
+        &lt;/div&gt;
+      &lt;/sonic-card-footer&gt;
+    &lt;/sonic-card&gt;
+</code></pre>
+
+    </article>
+  </main>
+</body>
+</html>

package/docs/crawl/core/components/ui/divider/divider.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/divider/divider.html" data-doc-id="core/components/ui/divider/divider">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Divider — Concorde</title>
+  <meta name="description" content="Default
+
+Align
+
+Size
+
+Custom
+
+  Lorem ipsum dolor sit amet  +25">
+  <meta name="keywords" content="Concorde, supersoniks, core/components/ui/divider/divider, divider, Divider, UI component, sonic-divider, web component">
+  <meta name="concorde-doc-id" content="core/components/ui/divider/divider">
+  <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/divider/divider.html">
+</head>
+<body>
+  <header>
+    <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/divider/divider.md/divider" rel="nofollow">interactive version</a></p>
+  </header>
+  <main>
+    <article>
+      <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Divider</strong>. Default
+
+Align
+
+Size
+
+Custom
+
+  Lorem ipsum dolor sit amet  +25 <span>Doc ID: <code>core/components/ui/divider/divider</code>. Keywords: Concorde, supersoniks, core/components/ui/divider/divider, divider, Divider, UI component, sonic-divider, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/divider/divider.html">https://concorde.supersoniks.org/crawl/core/components/ui/divider/divider.html</a>.</span></p>
+      <h1 id="divider">Divider</h1>
+<h2 id="default">Default</h2>
+<pre><code>&lt;sonic-divider&gt;&lt;/sonic-divider&gt;
+</code></pre>
+<h2 id="align">Align</h2>
+<pre><code>&lt;sonic-divider label=&quot;Default centered label&quot;&gt;&lt;/sonic-divider&gt;
+  &lt;sonic-divider label=&quot;Right&quot; align=&quot;right&quot;&gt;&lt;/sonic-divider&gt;
+  &lt;sonic-divider label=&quot;Center&quot; align=&quot;center&quot;&gt;&lt;/sonic-divider&gt;
+  &lt;sonic-divider label=&quot;Left&quot; align=&quot;left&quot;&gt;&lt;/sonic-divider&gt;
+</code></pre>
+<h2 id="size">Size</h2>
+<pre><code>&lt;sonic-divider size=&quot;xs&quot; label=&quot;xs&quot;&gt;&lt;/sonic-divider&gt;
+  &lt;sonic-divider size=&quot;sm&quot; label=&quot;sm&quot;&gt;&lt;/sonic-divider&gt;
+  &lt;sonic-divider size=&quot;md&quot; label=&quot;md&quot;&gt;&lt;/sonic-divider&gt;
+  &lt;sonic-divider size=&quot;lg&quot; label=&quot;lg&quot;&gt;&lt;/sonic-divider&gt;
+</code></pre>
+<h2 id="custom">Custom</h2>
+<pre><code>&lt;sonic-divider&gt;&lt;span class=&quot;mr-2&quot;&gt;Lorem ipsum dolor sit amet&lt;/span&gt;&lt;sonic-badge type=&quot;danger&quot;&gt;+25&lt;/sonic-badge&gt;&lt;/sonic-divider&gt;
+</code></pre>
+
+    </article>
+  </main>
+</body>
+</html>

package/docs/crawl/core/components/ui/form/checkbox/checkbox.html

@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/form/checkbox/checkbox.html" data-doc-id="core/components/ui/form/checkbox/checkbox">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Checkbox — Concorde</title>
+  <meta name="description" content="&gt;Already checked checkbox">
+  <meta name="keywords" content="Concorde, supersoniks, core/components/ui/form/checkbox/checkbox, checkbox, Checkbox, UI component, form, sonic-checkbox, web component, blacklistFlags, ?blacklistFlags=racist,sexist,…, flags, filterDocsJokes, src/docs/mock-api/fixtures.ts">
+  <meta name="concorde-doc-id" content="core/components/ui/form/checkbox/checkbox">
+  <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/form/checkbox/checkbox.html">
+</head>
+<body>
+  <header>
+    <p><a href="../../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/form/checkbox/checkbox.md/checkbox" rel="nofollow">interactive version</a></p>
+  </header>
+  <main>
+    <article>
+      <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Checkbox</strong>. &gt;Already checked checkbox <span>Doc ID: <code>core/components/ui/form/checkbox/checkbox</code>. Keywords: Concorde, supersoniks, core/components/ui/form/checkbox/checkbox, checkbox, Checkbox, UI component, form, sonic-checkbox, web component, blacklistFlags, ?blacklistFlags=racist,sexist,…, flags, filterDocsJokes, src/docs/mock-api/fixtures.ts. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/form/checkbox/checkbox.html">https://concorde.supersoniks.org/crawl/core/components/ui/form/checkbox/checkbox.html</a>.</span></p>
+      <h1 id="checkbox">Checkbox</h1>
+<h2 id="size">Size</h2>
+<pre><code>&lt;div class=&quot;grid gap-2&quot;&gt;
+    &lt;sonic-checkbox size=&quot;2xs&quot;&gt;2xs checkbox&lt;/sonic-checkbox&gt;
+    &lt;sonic-checkbox size=&quot;xs&quot;&gt;xs checkbox&lt;/sonic-checkbox&gt;
+    &lt;sonic-checkbox size=&quot;sm&quot;&gt;sm checkbox&lt;/sonic-checkbox&gt;
+    &lt;sonic-checkbox&gt;default checkbox&lt;/sonic-checkbox&gt;
+    &lt;sonic-checkbox size=&quot;lg&quot;&gt;lg checkbox&lt;/sonic-checkbox&gt;
+    &lt;sonic-checkbox size=&quot;xl&quot;&gt;xl checkbox&lt;/sonic-checkbox&gt;
+    &lt;sonic-checkbox size=&quot;2xl&quot;&gt;2xl checkbox&lt;/sonic-checkbox&gt;
+  &lt;/div&gt;
+</code></pre>
+<h2 id="checked">Checked</h2>
+<pre><code>&lt;sonic-checkbox checked
+    &gt;Already checked checkbox
+  &lt;/sonic-checkbox&gt;
+</code></pre>
+<h2 id="disabled">Disabled</h2>
+<pre><code>&lt;sonic-checkbox disabled
+    &gt;Disabled checkbox
+  &lt;/sonic-checkbox&gt;
+</code></pre>
+<h2 id="disabled-and-checked">Disabled and checked</h2>
+<pre><code>&lt;sonic-checkbox disabled checked
+    &gt;Disabled but already checked checkbox
+  &lt;/sonic-checkbox&gt;
+</code></pre>
+<h2 id="checkbox-with-link">Checkbox with link</h2>
+<pre><code>&lt;sonic-checkbox&gt;Checkbox with &lt;sonic-link href=&quot;#&quot; class=&quot;underline text-info&quot;&gt;link&lt;/sonic-link&gt;
+</code></pre>
+<h2 id="check-all-checkbox">Check all checkbox</h2>
+<pre><code>&lt;div formDataProvider=&quot;checkbox-check-all-demo&quot;&gt;
+      &lt;sonic-checkbox  name=&#39;someSharedName&#39; value=&quot;all&quot; checksAll&gt;All&lt;/sonic-checkbox&gt;
+      &lt;sonic-divider&gt;&lt;/sonic-divider&gt;
+      &lt;div class=&quot;grid gap-2&quot;&gt;
+      &lt;sonic-checkbox name=&quot;someSharedName&quot; value=&quot;foo&quot;&gt;Foo&lt;/sonic-checkbox&gt;
+      &lt;sonic-checkbox name=&quot;someSharedName&quot; value=&quot;bar&quot;&gt;Bar&lt;/sonic-checkbox&gt;
+      &lt;/div&gt;
+      &lt;sonic-divider&gt;&lt;/sonic-divider&gt;
+      &lt;div&gt;
+        &lt;span&gt;Enabling unsetOnDisconect ensures that outdated or irrelevant values are not retained in the form state once their associated inputs are no longer rendered.&lt;/span&gt;
+        &lt;div id=&quot;prunable-checkbox&quot; class=&quot;flex gap-2 items-center&quot;&gt;
+        &lt;sonic-checkbox name=&quot;someSharedName&quot; value=&quot;baz&quot;&gt;Baz&lt;/sonic-checkbox&gt;
+        &lt;sonic-button variant=&quot;ghost&quot; shape=&quot;circle&quot; unique name=&quot;toggleCheckboxExistance&quot; onclick=&quot;document.getElementById(&#39;prunable-checkbox&#39;).remove();&quot; value=&quot;true&quot;&gt;&lt;sonic-icon library=&quot;fontAwesome&quot; prefix=&quot;solid&quot; name=&quot;trash&quot;&gt;&lt;/sonic-icon&gt;&lt;/sonic-button&gt;
+        &lt;/div&gt;
+    &lt;/div&gt;
+</code></pre>
+<h2 id="example-of-use--blacklist--queue">Example of use — blacklist + queue</h2>
+<p>Checked <strong><code>blacklistFlags</code></strong> values are sent to the mock API (<code>?blacklistFlags=racist,sexist,…</code>), which excludes jokes whose <strong><code>flags</code></strong> match (see <code>filterDocsJokes</code> in <code>src/docs/mock-api/fixtures.ts</code>).</p>
+<p><docs-lit-demo for="docs-joke-blacklist-demo"></docs-lit-demo></p>
+
+    </article>
+  </main>
+</body>
+</html>

package/docs/crawl/core/components/ui/form/fieldset/fieldset.html

@@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/form/fieldset/fieldset.html" data-doc-id="core/components/ui/form/fieldset/fieldset">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Fieldset — Concorde</title>
+  <meta name="description" content="Default">
+  <meta name="keywords" content="Concorde, supersoniks, core/components/ui/form/fieldset/fieldset, fieldset, Fieldset, UI component, form, sonic-fieldset, web component">
+  <meta name="concorde-doc-id" content="core/components/ui/form/fieldset/fieldset">
+  <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/form/fieldset/fieldset.html">
+</head>
+<body>
+  <header>
+    <p><a href="../../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/form/fieldset/fieldset.md/fieldset" rel="nofollow">interactive version</a></p>
+  </header>
+  <main>
+    <article>
+      <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Fieldset</strong>. Default <span>Doc ID: <code>core/components/ui/form/fieldset/fieldset</code>. Keywords: Concorde, supersoniks, core/components/ui/form/fieldset/fieldset, fieldset, Fieldset, UI component, form, sonic-fieldset, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/form/fieldset/fieldset.html">https://concorde.supersoniks.org/crawl/core/components/ui/form/fieldset/fieldset.html</a>.</span></p>
+      <h1 id="fieldset">Fieldset</h1>
+<h2 id="variant">Variant</h2>
+<pre><code>&lt;sonic-fieldset variant=&quot;default&quot; &gt;
+      Default
+    &lt;/sonic-fieldset&gt;
+    &lt;sonic-fieldset variant=&quot;ghost&quot; &gt;
+      Ghost
+    &lt;/sonic-fieldset&gt;
+    &lt;sonic-fieldset variant=&quot;shadow&quot; &gt;
+      Shadow
+    &lt;/sonic-fieldset&gt;
+</code></pre>
+<h2 id="legend">Legend</h2>
+<pre><code>&lt;sonic-fieldset&gt;
+    &lt;sonic-legend label=&quot;Legend via attribut : label&quot; description=&quot;Description via attribut : description&quot;&gt;
+    &lt;/sonic-legend&gt;
+  &lt;/sonic-fieldset&gt;
+  &lt;sonic-fieldset&gt;
+    &lt;sonic-legend iconLibrary=&quot;iconoir&quot;  iconName=&quot;pin-alt&quot;&gt;
+      Custom legend via &lt;b&gt;slot&lt;/b&gt;
+      &lt;sonic-legend-description&gt;
+        Description via composant : sonic-legend-description
+      &lt;/sonic-legend-description&gt;
+    &lt;/sonic-legend&gt;
+  &lt;/sonic-fieldset&gt;
+</code></pre>
+<h2 id="short-hand">Short hand</h2>
+<pre><code>&lt;sonic-fieldset
+    label=&quot;All props on fieldset tag&quot;
+    description=&quot;Lorem ipsum dolor sit amet, consectetur adipiscing elit&quot;
+    iconLibrary=&quot;iconoir&quot;
+    iconName=&quot;user&quot;&gt;
+  &lt;/sonic-fieldset&gt;
+</code></pre>
+<h2 id="example-of-use">Example of use</h2>
+<pre><code>&lt;sonic-div formDataProvider=&quot;user_create&quot;&gt;
+    &lt;form action=&quot;/inscription?lang=fr&quot; method=&quot;POST&quot; class=&quot;mb-20&quot; accept-charset=&quot;UTF-8&quot; id=&quot;youpla&quot;&gt;
+      &lt;sonic-fieldset form=&quot;formid&quot; collapsible=&quot;true&quot; collapsed=&quot;false&quot;&gt;
+        &lt;sonic-legend iconLibrary=&quot;iconoir&quot;  iconName=&quot;user&quot;&gt;
+          Informations personnelles
+          &lt;span slot=&quot;description&quot;&gt;Description du fieldset lorem ipsum dolor&lt;/span&gt;
+          &lt;sonic-pop class=&quot;inline-block&quot; slot=&quot;suffix&quot;&gt;
+            &lt;sonic-button shape=&quot;circle&quot; variant=&quot;ghost&quot;&gt;
+              &lt;sonic-icon library=&quot;iconoir&quot; size=&quot;lg&quot; name=&quot;more-vert&quot;&gt;&lt;/sonic-icon
+            &gt;&lt;/sonic-button&gt;
+            &lt;sonic-menu slot=&quot;content&quot; minWidth=&quot;12rem&quot;&gt;
+              &lt;sonic-menu-item&gt;Mentions légales&lt;/sonic-menu-item&gt;
+              &lt;sonic-menu-item&gt;Conditions générales d&#39;utilisation&lt;/sonic-menu-item&gt;
+            &lt;/sonic-menu&gt;
+          &lt;/sonic-pop&gt;
+        &lt;/sonic-legend&gt;
+        &lt;sonic-form-layout&gt;
+          &lt;sonic-input autocomplete=&quot;family-name&quot; label=&quot;Nom&quot; name=&quot;nom&quot;&gt;&lt;/sonic-input&gt;
+          &lt;sonic-input autocomplete=&quot;given-name&quot; label=&quot;Prénom&quot; name=&quot;prenom&quot;&gt;&lt;/sonic-input&gt;
+          &lt;sonic-select autocomplete=&quot;sex&quot; label=&quot;Sexe&quot; name=&quot;sexe&quot;&gt;
+            &lt;option value=&quot;&quot; selected=&quot;selected&quot;&gt;- Sélectionner -&lt;/option&gt;
+            &lt;option value=&quot;-&quot;&gt;Je préfère ne pas le dire&lt;/option&gt;
+            &lt;option value=&quot;Homme&quot;&gt;Homme&lt;/option&gt;
+            &lt;option value=&quot;Femme&quot;&gt;Femme&lt;/option&gt;
+          &lt;/sonic-select&gt;
+          &lt;sonic-input autocomplete=&quot;bday&quot; label=&quot;Date de naissance&quot; name=&quot;date_naissance&quot; type=&quot;date&quot;&gt;&lt;/sonic-input&gt;
+          &lt;sonic-divider&gt;&lt;/sonic-divider&gt;
+          &lt;sonic-input autocomplete=&quot;email&quot; label=&quot;e-mail&quot; name=&quot;email&quot; type=&quot;email&quot;&gt;&lt;/sonic-input&gt;
+          &lt;sonic-input
+            autocomplete=&quot;email&quot;
+            label=&quot;Confirmer votre e-mail&quot;
+            name=&quot;email_confirmation&quot;
+            type=&quot;email&quot;
+          &gt;&lt;/sonic-input&gt;
+          &lt;sonic-input autocomplete=&quot;new-password&quot; label=&quot;Mot de passe&quot; name=&quot;password&quot; type=&quot;password&quot;&gt;&lt;/sonic-input&gt;
+          &lt;sonic-input
+            autocomplete=&quot;new-password&quot;
+            label=&quot;Confirmer votre mot de passe&quot;
+            name=&quot;password_confirmation&quot;
+            type=&quot;password&quot;
+          &gt;&lt;/sonic-input&gt;
+        &lt;/sonic-form-layout&gt;
+      &lt;/sonic-fieldset&gt;
+      &lt;sonic-fieldset form=&quot;formid&quot; collapsible=&quot;true&quot; collapsed=&quot;false&quot;&gt;
+        &lt;sonic-legend iconLibrary=&quot;iconoir&quot;  iconName=&quot;pin-alt&quot;&gt; Coordonnées &lt;/sonic-legend&gt;
+        &lt;sonic-form-layout&gt;
+          &lt;sonic-input autocomplete=&quot;postal-code&quot; label=&quot;Code postal&quot; name=&quot;cp&quot;&gt;&lt;/sonic-input&gt;
+          &lt;sonic-input autocomplete=&quot;address-level2&quot; label=&quot;Ville&quot; name=&quot;ville&quot;&gt;&lt;/sonic-input&gt;
+        &lt;/sonic-form-layout&gt;
+      &lt;/sonic-fieldset&gt;
+      &lt;div class=&quot;&quot;&gt;
+        &lt;sonic-button submit type=&quot;primary&quot;&gt;
+          &lt;sonic-icon  library=&quot;iconoir&quot; name=&quot;check&quot;&gt;&lt;/sonic-icon&gt;
+          S&#39;inscrire
+        &lt;/sonic-button&gt;
+        &lt;sonic-tooltip class=&quot;inline-flex&quot; label=&quot;Vous êtes sûr(e) ? 🙄&quot;&gt;
+          &lt;sonic-button size=&quot;sm&quot; variant=&quot;ghost&quot;&gt; Continuer sans m&#39;inscrire &lt;/sonic-button&gt;
+        &lt;/sonic-tooltip&gt;
+      &lt;/div&gt;
+    &lt;/form&gt;
+    &lt;div dataProvider=&quot;user_create&quot; class=&quot;my-6 text-neutral-600 p-5 rounded-xl shadow-lg&quot;&gt;
+       &lt;div class=&quot;font-bold text-lg text-neutral-400&quot;&gt;Submitted informations...&lt;/div&gt;
+      &lt;div class=&quot;text-lg my-2&quot;&gt;
+        &lt;sonic-value key=&quot;nom&quot; class=&quot;font-bold&quot;&gt;&lt;/sonic-value&gt;
+        &lt;sonic-value key=&quot;prenom&quot;&gt;&lt;/sonic-value&gt;
+      &lt;/div&gt;
+      &lt;div class=&quot;text-sm&quot;&gt;
+        &lt;sonic-value key=&quot;sexe&quot;&gt;&lt;/sonic-value&gt;
+        &lt;sonic-value key=&quot;date_naissance&quot;&gt;&lt;/sonic-value&gt;
+      &lt;/div&gt;
+      &lt;div class=&quot;text-sm&quot;&gt;
+        &lt;sonic-value key=&quot;email&quot;&gt;&lt;/sonic-value&gt;
+        &lt;sonic-value key=&quot;cp&quot;&gt;&lt;/sonic-value&gt;
+        &lt;sonic-value key=&quot;ville&quot;&gt;&lt;/sonic-value&gt;&lt;/div&gt;
+    &lt;/div&gt;
+  &lt;/sonic-div&gt;
+</code></pre>
+
+    </article>
+  </main>
+</body>
+</html>