@supersoniks/concorde 4.9.1 → 4.9.2
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.
- package/build-infos.json +1 -1
- package/concorde-core.bundle.js +106 -106
- package/concorde-core.es.js +4 -7
- package/dist/concorde-core.bundle.js +106 -106
- package/dist/concorde-core.es.js +4 -7
- package/dist/docs-mock-api-sw.js +1 -0
- package/dist/js/core/utils/HTML.js +4 -5
- package/dist/js/core/utils/HTML.js.map +1 -1
- package/dist/robots.txt +15 -1
- package/dist/types/core/utils/HTML.d.ts.map +1 -1
- package/docs/assets/{index-CZLTFws2.css → index-Bnp7gVaA.css} +1 -1
- package/docs/assets/{index-nkkwC13U.js → index-hElUgV9_.js} +505 -438
- package/docs/crawl/core/components/functional/date/date.html +190 -0
- package/docs/crawl/core/components/functional/fetch/fetch.html +109 -0
- package/docs/crawl/core/components/functional/if/if.html +27 -0
- package/docs/crawl/core/components/functional/list/list.html +70 -0
- package/docs/crawl/core/components/functional/mix/mix.html +45 -0
- package/docs/crawl/core/components/functional/queue/queue.html +96 -0
- package/docs/crawl/core/components/functional/router/router.html +106 -0
- package/docs/crawl/core/components/functional/sdui/sdui.html +269 -0
- package/docs/crawl/core/components/functional/states/states.html +66 -0
- package/docs/crawl/core/components/functional/submit/submit.html +160 -0
- package/docs/crawl/core/components/functional/subscriber/subscriber.html +67 -0
- package/docs/crawl/core/components/functional/value/value.html +51 -0
- package/docs/crawl/core/components/ui/alert/alert.html +110 -0
- package/docs/crawl/core/components/ui/alert-messages/alert-messages.html +23 -0
- package/docs/crawl/core/components/ui/badge/badge.html +119 -0
- package/docs/crawl/core/components/ui/button/button.html +149 -0
- package/docs/crawl/core/components/ui/captcha/captcha.html +30 -0
- package/docs/crawl/core/components/ui/card/card.html +99 -0
- package/docs/crawl/core/components/ui/divider/divider.html +58 -0
- package/docs/crawl/core/components/ui/form/checkbox/checkbox.html +73 -0
- package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +135 -0
- package/docs/crawl/core/components/ui/form/form-actions/form-actions.html +79 -0
- package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +62 -0
- package/docs/crawl/core/components/ui/form/input/input.html +109 -0
- package/docs/crawl/core/components/ui/form/input-autocomplete/input-autocomplete.html +106 -0
- package/docs/crawl/core/components/ui/form/radio/radio.html +56 -0
- package/docs/crawl/core/components/ui/form/select/select.html +73 -0
- package/docs/crawl/core/components/ui/form/switch/switch.html +56 -0
- package/docs/crawl/core/components/ui/form/textarea/textarea.html +59 -0
- package/docs/crawl/core/components/ui/group/group.html +82 -0
- package/docs/crawl/core/components/ui/icon/icon.html +133 -0
- package/docs/crawl/core/components/ui/image/image.html +110 -0
- package/docs/crawl/core/components/ui/link/link.html +42 -0
- package/docs/crawl/core/components/ui/loader/loader.html +50 -0
- package/docs/crawl/core/components/ui/menu/menu.html +322 -0
- package/docs/crawl/core/components/ui/modal/modal.html +117 -0
- package/docs/crawl/core/components/ui/pop/pop.html +102 -0
- package/docs/crawl/core/components/ui/progress/progress.html +58 -0
- package/docs/crawl/core/components/ui/table/table.html +413 -0
- package/docs/crawl/core/components/ui/toast/toast.html +122 -0
- package/docs/crawl/core/components/ui/tooltip/tooltip.html +79 -0
- package/docs/crawl/docs/_core-concept/dataFlow.html +166 -0
- package/docs/crawl/docs/_core-concept/overview.html +66 -0
- package/docs/crawl/docs/_core-concept/subscriber.html +75 -0
- package/docs/crawl/docs/_decorators/ancestor-attribute.html +116 -0
- package/docs/crawl/docs/_decorators/auto-subscribe.html +202 -0
- package/docs/crawl/docs/_decorators/bind.html +141 -0
- package/docs/crawl/docs/_decorators/get.html +120 -0
- package/docs/crawl/docs/_decorators/handle.html +165 -0
- package/docs/crawl/docs/_decorators/on-assign.html +355 -0
- package/docs/crawl/docs/_decorators/patch.html +52 -0
- package/docs/crawl/docs/_decorators/post.html +102 -0
- package/docs/crawl/docs/_decorators/publish.html +61 -0
- package/docs/crawl/docs/_decorators/put.html +49 -0
- package/docs/crawl/docs/_decorators/subscribe.html +109 -0
- package/docs/crawl/docs/_decorators/wait-for-ancestors.html +137 -0
- package/docs/crawl/docs/_directives/sub.html +93 -0
- package/docs/crawl/docs/_getting-started/ai-agents.html +134 -0
- package/docs/crawl/docs/_getting-started/concorde-manual-install.html +100 -0
- package/docs/crawl/docs/_getting-started/concorde-outside.html +58 -0
- package/docs/crawl/docs/_getting-started/create-a-component.html +111 -0
- package/docs/crawl/docs/_getting-started/my-first-component.html +189 -0
- package/docs/crawl/docs/_getting-started/my-first-subscriber.html +110 -0
- package/docs/crawl/docs/_getting-started/pubsub.html +62 -0
- package/docs/crawl/docs/_getting-started/start.html +76 -0
- package/docs/crawl/docs/_getting-started/theming.html +85 -0
- package/docs/crawl/docs/_misc/api-configuration.html +149 -0
- package/docs/crawl/docs/_misc/dataProviderKey.html +135 -0
- package/docs/crawl/docs/_misc/docs-mock-api.html +146 -0
- package/docs/crawl/docs/_misc/dynamic-path.html +180 -0
- package/docs/crawl/docs/_misc/endpoint.html +50 -0
- package/docs/crawl/docs/_misc/html-integration.html +47 -0
- package/docs/crawl/hubs/decorators.html +467 -0
- package/docs/crawl/hubs/form-components.html +357 -0
- package/docs/crawl/hubs/remote-data.html +374 -0
- package/docs/crawl/index.html +99 -0
- package/docs/docs-mock-api-sw.js +3 -1
- package/docs/docs-mock-api-sw.js.map +2 -2
- package/docs/index.html +3 -2
- package/docs/llms-full.txt +5423 -0
- package/docs/llms.txt +102 -0
- package/docs/robots.txt +15 -1
- package/docs/sitemap.xml +231 -0
- package/docs/src/docs/_decorators/get.md +47 -1
- package/docs/src/docs/search/docs-search.json +31 -1
- package/index.html +1 -0
- package/package.json +1 -1
- package/public/docs-mock-api-sw.js +1 -0
- package/public/robots.txt +15 -1
- package/scripts/generate-crawl-docs.mjs +569 -0
- package/scripts/post-build-docs.js +18 -14
- package/src/core/decorators/subscriber/ancestorAttribute.spec.ts +42 -0
- package/src/core/utils/HTML.ts +4 -5
- package/src/docs/search/docs-search.json +61 -1
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/functional/subscriber/subscriber.html" data-doc-id="core/components/functional/subscriber/subscriber">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Subscriber — Concorde</title>
|
|
7
|
+
<meta name="description" content="La mixin Subscriber permet lier un composant à un publisher.">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/functional/subscriber/subscriber, subscriber, Subscriber, functional component, sonic-subscriber, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/functional/subscriber/subscriber">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/functional/subscriber/subscriber.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/functional/subscriber/subscriber.md/subscriber" rel="nofollow">interactive version</a></p>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<p class="doc-lead" id="doc-summary"><strong>Concorde functional component — Subscriber</strong>. La mixin Subscriber permet lier un composant à un publisher. <span>Doc ID: <code>core/components/functional/subscriber/subscriber</code>. Keywords: Concorde, supersoniks, core/components/functional/subscriber/subscriber, subscriber, Subscriber, functional component, sonic-subscriber, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/functional/subscriber/subscriber.html">https://concorde.supersoniks.org/crawl/core/components/functional/subscriber/subscriber.html</a>.</span></p>
|
|
19
|
+
<h1 id="subscriber">Subscriber</h1>
|
|
20
|
+
<p>La mixin Subscriber permet lier un composant à un publisher.
|
|
21
|
+
La liaison à un publisher se fait via l'attribut <em>dataProvider</em> du composant qui représente ce que l'on obtient en appellant PublisherManager.get(dataProvider).</p>
|
|
22
|
+
<p>Les propriétés du composant sont automatiquement remplies avec les propriétés du même nom dans les données du publisher.</p>
|
|
23
|
+
<p>Le composant est automatiquement mis à jour lorsque les données du publisher sont mises à jour.</p>
|
|
24
|
+
<h2 id="dataprovider">DataProvider</h2>
|
|
25
|
+
<p><strong>Id</strong> of the dataProvider that the component will <strong>subscribe</strong> to</p>
|
|
26
|
+
<pre><code><sonic-subscriber dataProvider="id_that_the_subsriber_will_subscribe_to" debug>
|
|
27
|
+
<sonic-button> custom dataProvider id</sonic-button>
|
|
28
|
+
</sonic-subscriber>
|
|
29
|
+
<sonic-subscriber debug>
|
|
30
|
+
<sonic-button> default id : pageHTML</sonic-button>
|
|
31
|
+
</sonic-subscriber>
|
|
32
|
+
</code></pre>
|
|
33
|
+
<h2 id="props">Props</h2>
|
|
34
|
+
<p>Data object (json) that will be passed to the dataProvider</p>
|
|
35
|
+
<pre><code><sonic-subscriber props='{"data":"Hello world"}' debug>
|
|
36
|
+
<sonic-button> Hover to see the data</sonic-button>
|
|
37
|
+
</sonic-subscriber>
|
|
38
|
+
</code></pre>
|
|
39
|
+
<h2 id="debug">Debug</h2>
|
|
40
|
+
<p><strong>Helper</strong>, display the data held by the dataProvider in a floating div</p>
|
|
41
|
+
<pre><code><sonic-subscriber debug>
|
|
42
|
+
<sonic-button> see the dataProvider'data </sonic-button>
|
|
43
|
+
</sonic-subscriber>
|
|
44
|
+
</code></pre>
|
|
45
|
+
<h2 id="noautofill">NoAutofill</h2>
|
|
46
|
+
<p><sonic-alert status="info">Docs coming soon</sonic-alert></p>
|
|
47
|
+
<h2 id="propertymap">PropertyMap</h2>
|
|
48
|
+
<p><sonic-alert status="info">Docs coming soon</sonic-alert></p>
|
|
49
|
+
<p>Permet de mapper un nom de propriété de donnée source vers une propriété du subscriber à la volée</p>
|
|
50
|
+
<h2 id="bindpublisher">BindPublisher</h2>
|
|
51
|
+
<p><sonic-alert status="info">Docs coming soon</sonic-alert></p>
|
|
52
|
+
<p>On peut utiliser cette fonction pour lier un publisher spécifique au composant si besoin.</p>
|
|
53
|
+
<h2 id="instancecounter">instanceCounter</h2>
|
|
54
|
+
<p><sonic-alert status="info">Docs coming soon</sonic-alert></p>
|
|
55
|
+
<h2 id="publisher">Publisher</h2>
|
|
56
|
+
<p><sonic-alert status="info">Docs coming soon</sonic-alert></p>
|
|
57
|
+
<h2 id="args">Args</h2>
|
|
58
|
+
<p><sonic-alert status="info">Docs coming soon</sonic-alert></p>
|
|
59
|
+
<h2 id="noshadowdom">NoShadowDom</h2>
|
|
60
|
+
<p>Par défaut on crée un shadow dom mais on peut demander à ne pas en avoir via cette propriété et un attribut associé.<br>Cela se fait à l'initialisation uniquement et n'est pas modifiable lors de la vie du composant.</p>
|
|
61
|
+
<h2 id="other-attributes-gathered-from-subscriberstoriests">Other attributes gathered from subscriber.stories.ts</h2>
|
|
62
|
+
<p>styles ??<br>title ??<br>_props ??<br>onAssign ??<br>defferedDebug ??</p>
|
|
63
|
+
|
|
64
|
+
</article>
|
|
65
|
+
</main>
|
|
66
|
+
</body>
|
|
67
|
+
</html>
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/functional/value/value.html" data-doc-id="core/components/functional/value/value">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Value — Concorde</title>
|
|
7
|
+
<meta name="description" content="Simply shows a value from a data provider.">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/functional/value/value, value, Value, functional component, sonic-value, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/functional/value/value">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/functional/value/value.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/functional/value/value.md/value" rel="nofollow">interactive version</a></p>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<p class="doc-lead" id="doc-summary"><strong>Concorde functional component — Value</strong>. Simply shows a value from a data provider. <span>Doc ID: <code>core/components/functional/value/value</code>. Keywords: Concorde, supersoniks, core/components/functional/value/value, value, Value, functional component, sonic-value, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/functional/value/value.html">https://concorde.supersoniks.org/crawl/core/components/functional/value/value.html</a>.</span></p>
|
|
19
|
+
<h1 id="value">Value</h1>
|
|
20
|
+
<p>Simply shows a value from a data provider.
|
|
21
|
+
You can target sub data value using dot syntax.
|
|
22
|
+
The value reacts to changes.</p>
|
|
23
|
+
<ul>
|
|
24
|
+
<li>Below is a form that helps you to set a value for the field "preference" in the data target with id "value-example"</li>
|
|
25
|
+
</ul>
|
|
26
|
+
<pre><code><div formDataProvider="value-example">
|
|
27
|
+
which one do you prefer ?
|
|
28
|
+
<sonic-radio name="preference" checked value="dogs"> Dogs</sonic-radio>
|
|
29
|
+
<sonic-radio name="preference" value="cats"> Cats</sonic-radio>
|
|
30
|
+
</div>
|
|
31
|
+
</code></pre>
|
|
32
|
+
<ul>
|
|
33
|
+
<li>Then you can see live value of the preference using this code :</li>
|
|
34
|
+
</ul>
|
|
35
|
+
<pre><code>I prefer <sonic-value dataProvider="value-example" key="preference"></sonic-value>
|
|
36
|
+
</code></pre>
|
|
37
|
+
<ul>
|
|
38
|
+
<li>If you have more complex data like this</li>
|
|
39
|
+
</ul>
|
|
40
|
+
<pre><code><sonic-subscriber dataProvider="value-example-2" props='{"my":{"complex":[{"data":"👋 Hi There"}]}}'></sonic-subscriber>
|
|
41
|
+
</code></pre>
|
|
42
|
+
<ul>
|
|
43
|
+
<li>You can target it with the dot syntax</li>
|
|
44
|
+
</ul>
|
|
45
|
+
<pre><code><sonic-value dataProvider="value-example-2" key="my.complex.0.data"></sonic-value>
|
|
46
|
+
</code></pre>
|
|
47
|
+
|
|
48
|
+
</article>
|
|
49
|
+
</main>
|
|
50
|
+
</body>
|
|
51
|
+
</html>
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/alert/alert.html" data-doc-id="core/components/ui/alert/alert">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Alert — Concorde</title>
|
|
7
|
+
<meta name="description" content="This address is already in use. Lorem ipsum dolor sit amet.">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/ui/alert/alert, alert, Alert, UI component, sonic-alert, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/ui/alert/alert">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/alert/alert.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/alert/alert.md/alert" rel="nofollow">interactive version</a></p>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Alert</strong>. This address is already in use. Lorem ipsum dolor sit amet. <span>Doc ID: <code>core/components/ui/alert/alert</code>. Keywords: Concorde, supersoniks, core/components/ui/alert/alert, alert, Alert, UI component, sonic-alert, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/alert/alert.html">https://concorde.supersoniks.org/crawl/core/components/ui/alert/alert.html</a>.</span></p>
|
|
19
|
+
<h1 id="alert">Alert</h1>
|
|
20
|
+
<pre><code><sonic-alert status="error" label="Email error" text="This address is already in use" background></sonic-alert>
|
|
21
|
+
</code></pre>
|
|
22
|
+
<h2 id="status">Status</h2>
|
|
23
|
+
<pre><code><div class="grid gap-4">
|
|
24
|
+
<sonic-alert label="Default"> This address is already in use. </sonic-alert>
|
|
25
|
+
<sonic-alert status="success" label="Success"> This address is already in use. </sonic-alert>
|
|
26
|
+
<sonic-alert status="error" label="Error"> This address is already in use. </sonic-alert>
|
|
27
|
+
<sonic-alert status="warning" label="Warning"> This address is already in use. </sonic-alert>
|
|
28
|
+
<sonic-alert status="info" label="Info"> This address is already in use. </sonic-alert>
|
|
29
|
+
</div>
|
|
30
|
+
</code></pre>
|
|
31
|
+
<h2 id="sizes">Sizes</h2>
|
|
32
|
+
<pre><code><div class="grid gap-4">
|
|
33
|
+
<sonic-alert status="error" label="Email error" size="2xs">
|
|
34
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
35
|
+
</sonic-alert>
|
|
36
|
+
<sonic-alert status="error" label="Email error" size="xs">
|
|
37
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
38
|
+
</sonic-alert>
|
|
39
|
+
<sonic-alert status="error" label="Email error" size="sm">
|
|
40
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
41
|
+
</sonic-alert>
|
|
42
|
+
<sonic-alert status="error" label="Email error">
|
|
43
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
44
|
+
</sonic-alert>
|
|
45
|
+
<sonic-alert status="error" label="Email error" size="lg">
|
|
46
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
47
|
+
</sonic-alert>
|
|
48
|
+
<sonic-alert status="error" label="Email error" size="xl">
|
|
49
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
50
|
+
</sonic-alert>
|
|
51
|
+
<sonic-alert status="error" label="Email error" size="2xl">
|
|
52
|
+
This address is already in use. Lorem ipsum dolor sit amet.
|
|
53
|
+
</sonic-alert>
|
|
54
|
+
</div>
|
|
55
|
+
</code></pre>
|
|
56
|
+
<h2 id="alert-with-link">Alert with link</h2>
|
|
57
|
+
<pre><code><sonic-alert status="info" label="New messages !">
|
|
58
|
+
You have 2 unread messages<br />
|
|
59
|
+
<div class="flex gap-2 mt-1">
|
|
60
|
+
<sonic-button variant="outline" type="info" size="xs">See messages</sonic-button>
|
|
61
|
+
<sonic-button variant="ghost" type="info" size="xs">dismiss</sonic-button>
|
|
62
|
+
</div>
|
|
63
|
+
</sonic-alert>
|
|
64
|
+
</code></pre>
|
|
65
|
+
<h2 id="background">Background</h2>
|
|
66
|
+
<pre><code><div class="grid gap-4">
|
|
67
|
+
<sonic-alert background label="Lorem ipsum dolor">
|
|
68
|
+
This address is already in use.
|
|
69
|
+
</sonic-alert>
|
|
70
|
+
<sonic-alert status="success" background label="Lorem ipsum dolor">
|
|
71
|
+
This address is already in use.
|
|
72
|
+
</sonic-alert>
|
|
73
|
+
<sonic-alert status="error" background label="Lorem ipsum dolor">
|
|
74
|
+
This address is already in use.
|
|
75
|
+
</sonic-alert>
|
|
76
|
+
<sonic-alert status="warning" background label="Lorem ipsum dolor">
|
|
77
|
+
This address is already in use.
|
|
78
|
+
</sonic-alert>
|
|
79
|
+
<sonic-alert status="info" background label="Lorem ipsum dolor">
|
|
80
|
+
This address is already in use.
|
|
81
|
+
</sonic-alert>
|
|
82
|
+
</div>
|
|
83
|
+
</code></pre>
|
|
84
|
+
<h2 id="dismissible">Dismissible</h2>
|
|
85
|
+
<pre><code><sonic-alert class="mb-3" dismissible label="Lorem ipsum dolor">
|
|
86
|
+
This address is already in use.
|
|
87
|
+
</sonic-alert>
|
|
88
|
+
<sonic-alert status="success" class="mb-3" dismissible label="Lorem ipsum dolor">
|
|
89
|
+
This address is already in use.
|
|
90
|
+
</sonic-alert>
|
|
91
|
+
<sonic-alert status="error" class="mb-3" dismissible label="Lorem ipsum dolor">
|
|
92
|
+
This address is already in use.
|
|
93
|
+
</sonic-alert>
|
|
94
|
+
<sonic-alert status="warning" class="mb-3" dismissible label="Lorem ipsum dolor">
|
|
95
|
+
This address is already in use.
|
|
96
|
+
</sonic-alert>
|
|
97
|
+
<sonic-alert status="info" class="mb-3" dismissible label="Lorem ipsum dolor">
|
|
98
|
+
This address is already in use.
|
|
99
|
+
</sonic-alert>
|
|
100
|
+
</code></pre>
|
|
101
|
+
<h2 id="dismiss-forever">Dismiss forever</h2>
|
|
102
|
+
<pre><code><sonic-alert class="mb-3" dismissible dismissForever label="Lorem ipsum dolor" id="addressUniqueId">
|
|
103
|
+
This address is already in use.
|
|
104
|
+
</sonic-alert>
|
|
105
|
+
</code></pre>
|
|
106
|
+
|
|
107
|
+
</article>
|
|
108
|
+
</main>
|
|
109
|
+
</body>
|
|
110
|
+
</html>
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/alert-messages/alert-messages.html" data-doc-id="core/components/ui/alert-messages/alert-messages">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Concorde — Concorde</title>
|
|
7
|
+
<meta name="description" content="Concorde documentation: Concorde">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/ui/alert-messages/alert-messages, alert-messages, UI component, sonic-alert-messages, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/ui/alert-messages/alert-messages">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/alert-messages/alert-messages.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/alert-messages/alert-messages.md/alert-messages" rel="nofollow">interactive version</a></p>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Concorde</strong>. Concorde documentation: Concorde <span>Doc ID: <code>core/components/ui/alert-messages/alert-messages</code>. Keywords: Concorde, supersoniks, core/components/ui/alert-messages/alert-messages, alert-messages, UI component, sonic-alert-messages, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/alert-messages/alert-messages.html">https://concorde.supersoniks.org/crawl/core/components/ui/alert-messages/alert-messages.html</a>.</span></p>
|
|
19
|
+
|
|
20
|
+
</article>
|
|
21
|
+
</main>
|
|
22
|
+
</body>
|
|
23
|
+
</html>
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/badge/badge.html" data-doc-id="core/components/ui/badge/badge">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Badge — Concorde</title>
|
|
7
|
+
<meta name="description" content="Messages <sonic-badge slot="suffix" type="danger" size="xs">5</sonic-badge>">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/ui/badge/badge, badge, Badge, UI component, sonic-badge, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/ui/badge/badge">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/badge/badge.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/badge/badge.md/badge" rel="nofollow">interactive version</a></p>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Badge</strong>. Messages <sonic-badge slot="suffix" type="danger" size="xs">5</sonic-badge> <span>Doc ID: <code>core/components/ui/badge/badge</code>. Keywords: Concorde, supersoniks, core/components/ui/badge/badge, badge, Badge, UI component, sonic-badge, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/badge/badge.html">https://concorde.supersoniks.org/crawl/core/components/ui/badge/badge.html</a>.</span></p>
|
|
19
|
+
<h1 id="badge">Badge</h1>
|
|
20
|
+
<h2 id="type">Type</h2>
|
|
21
|
+
<pre><code><sonic-badge>Default</sonic-badge>
|
|
22
|
+
<sonic-badge type="primary">Primary</sonic-badge>
|
|
23
|
+
<sonic-badge type="neutral">Neutral</sonic-badge>
|
|
24
|
+
<sonic-badge type="warning">Warning</sonic-badge>
|
|
25
|
+
<sonic-badge type="info">Info</sonic-badge>
|
|
26
|
+
<sonic-badge type="success">Success</sonic-badge>
|
|
27
|
+
<sonic-badge type="danger">Danger</sonic-badge>
|
|
28
|
+
<sonic-badge type="contrast">Contrast</sonic-badge>
|
|
29
|
+
</code></pre>
|
|
30
|
+
<h2 id="outline">Outline</h2>
|
|
31
|
+
<pre><code><div class="flex items-center flex-wrap gap-3">
|
|
32
|
+
<sonic-badge variant="outline">Default</sonic-badge>
|
|
33
|
+
<sonic-badge variant="outline" type="primary">Primary</sonic-badge>
|
|
34
|
+
<sonic-badge variant="outline" type="neutral">Neutral</sonic-badge>
|
|
35
|
+
<sonic-badge variant="outline" type="warning">Warning</sonic-badge>
|
|
36
|
+
<sonic-badge variant="outline" type="info">Info</sonic-badge>
|
|
37
|
+
<sonic-badge variant="outline" type="success">Success</sonic-badge>
|
|
38
|
+
<sonic-badge variant="outline" type="danger">Danger</sonic-badge>
|
|
39
|
+
<sonic-badge variant="outline" type="contrast">Contrast</sonic-badge>
|
|
40
|
+
</div>
|
|
41
|
+
</code></pre>
|
|
42
|
+
<h2 id="ghost">Ghost</h2>
|
|
43
|
+
<pre><code><div class="flex items-center flex-wrap gap-3">
|
|
44
|
+
<sonic-badge variant="ghost">Default</sonic-badge>
|
|
45
|
+
<sonic-badge variant="ghost" type="primary">Primary</sonic-badge>
|
|
46
|
+
<sonic-badge variant="ghost" type="neutral">Neutral</sonic-badge>
|
|
47
|
+
<sonic-badge variant="ghost" type="warning">Warning</sonic-badge>
|
|
48
|
+
<sonic-badge variant="ghost" type="info">Info</sonic-badge>
|
|
49
|
+
<sonic-badge variant="ghost" type="success">Success</sonic-badge>
|
|
50
|
+
<sonic-badge variant="ghost" type="danger">Danger</sonic-badge>
|
|
51
|
+
<sonic-badge variant="ghost" type="contrast">Contrast</sonic-badge>
|
|
52
|
+
</div>
|
|
53
|
+
</code></pre>
|
|
54
|
+
<h2 id="size">Size</h2>
|
|
55
|
+
<pre><code><sonic-badge size="2xs">2Xs badge</sonic-badge>
|
|
56
|
+
<sonic-badge size="xs">Xs badge</sonic-badge>
|
|
57
|
+
<sonic-badge size="sm">Sm badge</sonic-badge>
|
|
58
|
+
<sonic-badge>Md badge</sonic-badge>
|
|
59
|
+
<sonic-badge size="lg">Lg badge</sonic-badge>
|
|
60
|
+
<sonic-badge size="xl">Xl badge</sonic-badge>
|
|
61
|
+
<sonic-badge size="2xl">2Xl badge</sonic-badge>
|
|
62
|
+
</code></pre>
|
|
63
|
+
<h2 id="empty-badges">Empty badges</h2>
|
|
64
|
+
<pre><code><div class="flex items-center flex-wrap gap-3">
|
|
65
|
+
<sonic-badge type="danger" size="2xs"></sonic-badge>
|
|
66
|
+
<sonic-badge type="danger" size="xs"></sonic-badge>
|
|
67
|
+
<sonic-badge type="danger" size="sm"></sonic-badge>
|
|
68
|
+
<sonic-badge type="danger"></sonic-badge>
|
|
69
|
+
<sonic-badge type="danger" size="lg"></sonic-badge>
|
|
70
|
+
<sonic-badge type="danger" size="xl"></sonic-badge>
|
|
71
|
+
<sonic-badge type="danger" size="2xl"></sonic-badge>
|
|
72
|
+
</div>
|
|
73
|
+
</code></pre>
|
|
74
|
+
<h2 id="ellipsis">Ellipsis</h2>
|
|
75
|
+
<pre><code><div class="grid grid-cols-3 gap-4" >
|
|
76
|
+
<sonic-badge ellipsis size="sm" variant="outline" >
|
|
77
|
+
<sonic-icon slot="prefix" name="info-empty" library="iconoir"></sonic-icon> Lorem ipsum dolor sit consectetur adipiscing elit. Lorem ipsum dolor sit consectetur adipiscing elit.</sonic-badge>
|
|
78
|
+
<sonic-badge ellipsis size="sm" > <sonic-icon slot="prefix" name="info-empty" library="iconoir"></sonic-icon> Lorem ipsum dolor sit consectetur adipiscing elit. Lorem ipsum dolor sit consectetur adipiscing elit.</sonic-badge>
|
|
79
|
+
</div>
|
|
80
|
+
</code></pre>
|
|
81
|
+
<h2 id="badge-in-button">Badge in button</h2>
|
|
82
|
+
<pre><code><div class="flex flex-wrap gap-4 items-center">
|
|
83
|
+
<sonic-button type="default">
|
|
84
|
+
Messages <sonic-badge slot="suffix" type="danger" size="xs">5</sonic-badge>
|
|
85
|
+
</sonic-button>
|
|
86
|
+
<div class="relative inline-block">
|
|
87
|
+
<sonic-button type="success" class="relative"> Mon compte </sonic-button>
|
|
88
|
+
<sonic-badge type="danger" size="xs" class="absolute right-1 top-0 pe-none transform -translate-y-1/2"
|
|
89
|
+
>12</sonic-badge
|
|
90
|
+
>
|
|
91
|
+
</div>
|
|
92
|
+
<div class="relative inline-block">
|
|
93
|
+
<sonic-button type="neutral" shape="circle" variant="outline"
|
|
94
|
+
><sonic-icon library="iconoir" name="user"></sonic-icon>
|
|
95
|
+
</sonic-button>
|
|
96
|
+
<sonic-badge
|
|
97
|
+
type="danger"
|
|
98
|
+
size="xs"
|
|
99
|
+
class="absolute right-1 bottom-1 pe-none transform translate-y-1/2 translate-x-1/2"
|
|
100
|
+
>33</sonic-badge
|
|
101
|
+
>
|
|
102
|
+
</div>
|
|
103
|
+
<div class="relative inline-block">
|
|
104
|
+
<sonic-button type="neutral" shape="circle" variant="outline"
|
|
105
|
+
><sonic-icon library="iconoir" name="user"></sonic-icon>
|
|
106
|
+
</sonic-button>
|
|
107
|
+
<sonic-badge
|
|
108
|
+
type="danger"
|
|
109
|
+
size="xs"
|
|
110
|
+
class="absolute right-2 bottom-2 pe-none transform translate-y-1/2 translate-x-1/2"
|
|
111
|
+
></sonic-badge>
|
|
112
|
+
</div>
|
|
113
|
+
</div>
|
|
114
|
+
</code></pre>
|
|
115
|
+
|
|
116
|
+
</article>
|
|
117
|
+
</main>
|
|
118
|
+
</body>
|
|
119
|
+
</html>
|
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<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">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Button — Concorde</title>
|
|
7
|
+
<meta name="description" content="The length of the button depends on the size of its content">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/ui/button/button, button, Button, UI component, sonic-button, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/ui/button/button">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/button/button.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<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>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<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>
|
|
19
|
+
<h1 id="button">Button</h1>
|
|
20
|
+
<h2 id="type">Type</h2>
|
|
21
|
+
<pre><code><div class="flex flex-wrap gap-2">
|
|
22
|
+
<sonic-button>Default</sonic-button>
|
|
23
|
+
<sonic-button type="primary">Primary</sonic-button>
|
|
24
|
+
<sonic-button type="neutral">Neutral</sonic-button>
|
|
25
|
+
<sonic-button type="warning">Warning</sonic-button>
|
|
26
|
+
<sonic-button type="info">Info</sonic-button>
|
|
27
|
+
<sonic-button type="success">Success</sonic-button>
|
|
28
|
+
<sonic-button type="danger">Danger</sonic-button>
|
|
29
|
+
<sonic-button type="custom" style="--sc-btn-custom-color: #fde68a; --sc-btn-custom-bg: #5b21b6">Custom</sonic-button>
|
|
30
|
+
</div>
|
|
31
|
+
</code></pre>
|
|
32
|
+
<h2 id="outline">Outline</h2>
|
|
33
|
+
<pre><code><div class="flex flex-wrap gap-2">
|
|
34
|
+
<sonic-button variant="outline">Default</sonic-button>
|
|
35
|
+
<sonic-button variant="outline" type="primary">Primary</sonic-button>
|
|
36
|
+
<sonic-button variant="outline" type="neutral">Neutral</sonic-button>
|
|
37
|
+
<sonic-button variant="outline" type="warning">Warning</sonic-button>
|
|
38
|
+
<sonic-button variant="outline" type="info">Info</sonic-button>
|
|
39
|
+
<sonic-button variant="outline" type="success">Success</sonic-button>
|
|
40
|
+
<sonic-button variant="outline" type="danger">Danger</sonic-button>
|
|
41
|
+
<sonic-button variant="outline" type="custom" style="--sc-btn-custom-bg: #5b21b6">Custom</sonic-button>
|
|
42
|
+
</div>
|
|
43
|
+
</code></pre>
|
|
44
|
+
<h2 id="variant">Variant</h2>
|
|
45
|
+
<pre><code><sonic-button variant="default">Default</sonic-button>
|
|
46
|
+
<sonic-button variant="outline">Outline</sonic-button>
|
|
47
|
+
<sonic-button variant="ghost">Ghost</sonic-button>
|
|
48
|
+
<sonic-button variant="link">Link</sonic-button>
|
|
49
|
+
<sonic-button variant="unstyled">Unstyled</sonic-button>
|
|
50
|
+
</code></pre>
|
|
51
|
+
<h2 id="size">Size</h2>
|
|
52
|
+
<pre><code><sonic-button size="2xs">2Xs button</sonic-button>
|
|
53
|
+
<sonic-button size="xs">Xs button</sonic-button>
|
|
54
|
+
<sonic-button size="sm">Sm button</sonic-button>
|
|
55
|
+
<sonic-button size="md">Md button</sonic-button>
|
|
56
|
+
<sonic-button>Default button</sonic-button>
|
|
57
|
+
<sonic-button size="lg">Lg button</sonic-button>
|
|
58
|
+
<sonic-button size="xl">Xl button</sonic-button>
|
|
59
|
+
<sonic-button size="2xl">2Xl button</sonic-button>
|
|
60
|
+
</code></pre>
|
|
61
|
+
<h2 id="shape">Shape</h2>
|
|
62
|
+
<pre><code><sonic-button shape="circle"> 😂 </sonic-button>
|
|
63
|
+
<sonic-button shape="square"> 🚀 </sonic-button>
|
|
64
|
+
</code></pre>
|
|
65
|
+
<h2 id="loading">Loading</h2>
|
|
66
|
+
<p>The length of the button depends on the size of its content</p>
|
|
67
|
+
<pre><code><sonic-button loading></sonic-button>
|
|
68
|
+
<sonic-button loading>Loading button</sonic-button>
|
|
69
|
+
</code></pre>
|
|
70
|
+
<h2 id="swap">Swap</h2>
|
|
71
|
+
<pre><code><sonic-button formDataProvider="button_swap_example" name="youpi" value="youpla" type="primary" shape="circle" variant="outline" class="mr-4">
|
|
72
|
+
<sonic-icon library="iconoir" swap="on" name="eye-empty"></sonic-icon>
|
|
73
|
+
<sonic-icon library="iconoir" swap="off" name="eye-off"></sonic-icon>
|
|
74
|
+
</sonic-button>
|
|
75
|
+
<sonic-button formDataProvider="button_swap_example" name="youpi" value="youpla" type="primary" variant="outline">
|
|
76
|
+
<sonic-icon library="iconoir" swap="on" slot="prefix" name="eye-empty"></sonic-icon>
|
|
77
|
+
<sonic-icon library="iconoir" swap="off" slot="prefix" name="eye-off"></sonic-icon>
|
|
78
|
+
Révélez
|
|
79
|
+
<span swap="off">...</span>
|
|
80
|
+
<span swap="on">moi !</span>
|
|
81
|
+
</sonic-button>
|
|
82
|
+
</code></pre>
|
|
83
|
+
<h2 id="reset">Reset</h2>
|
|
84
|
+
<pre><code><div formDataProvider="button-reset-demo" class="mb-2">
|
|
85
|
+
<sonic-checkbox name="aChexbox" value="AValueToSet">Set A value</sonic-checkbox><br>
|
|
86
|
+
<sonic-button reset>Reset current formDataProvider</sonic-button>
|
|
87
|
+
</div>
|
|
88
|
+
<sonic-button reset="button-reset-demo">Reset formDataProvider by name</sonic-button>
|
|
89
|
+
</code></pre>
|
|
90
|
+
<h2 id="goback">GoBack</h2>
|
|
91
|
+
<pre><code><sonic-button goBack type="primary" variant="outline" class="mr-4">
|
|
92
|
+
<sonic-icon library="iconoir" slot="prefix" name="arrow-left"></sonic-icon>
|
|
93
|
+
Retour classique
|
|
94
|
+
</sonic-button>
|
|
95
|
+
<sonic-button goBack="http://la-billetterie.net" type="primary" variant="outline" class="mr-4">
|
|
96
|
+
<sonic-icon library="iconoir" slot="prefix" name="arrow-left"></sonic-icon>
|
|
97
|
+
Retour url prédéfinie
|
|
98
|
+
</sonic-button>
|
|
99
|
+
</code></pre>
|
|
100
|
+
<h2 id="button-with-icon">Button with icon</h2>
|
|
101
|
+
<pre><code><sonic-button goBack type="primary" variant="outline" class="mr-4">
|
|
102
|
+
<sonic-icon library="iconoir" slot="prefix" name="arrow-right" ></sonic-icon>
|
|
103
|
+
Button with icon
|
|
104
|
+
</sonic-button>
|
|
105
|
+
</code></pre>
|
|
106
|
+
<h2 id="button-group">Button group</h2>
|
|
107
|
+
<pre><code><sonic-group label="Code promo" class="mr-4">
|
|
108
|
+
<sonic-input placeholder="Entrez votre code ici..."></sonic-input>
|
|
109
|
+
<sonic-button type="primary" shape="square">
|
|
110
|
+
<sonic-icon library="iconoir" library="iconoir" name="gift"></sonic-icon>
|
|
111
|
+
</sonic-button>
|
|
112
|
+
</sonic-group>
|
|
113
|
+
<sonic-divider size="lg"></sonic-divider>
|
|
114
|
+
<div class="text-lg mb-2">Choose a subscription</div>
|
|
115
|
+
<sonic-group formDataProvider="subscriptionData">
|
|
116
|
+
<sonic-button radio minWidth="10rem" name="subscription" value="standard" type="default"
|
|
117
|
+
>😎 Standard</sonic-button
|
|
118
|
+
>
|
|
119
|
+
<sonic-button radio minWidth="10rem" name="subscription" value="premium" type="default">⭐ Premium</sonic-button>
|
|
120
|
+
<sonic-button radio minWidth="10rem" name="subscription" value="diamond" type="default">💎 Diamond</sonic-button>
|
|
121
|
+
</sonic-group>
|
|
122
|
+
</code></pre>
|
|
123
|
+
<h2 id="aria-label">Aria-label</h2>
|
|
124
|
+
<pre><code><sonic-button data-aria-label="Custom aria label" type="primary" >
|
|
125
|
+
Button with aria label
|
|
126
|
+
</sonic-button>
|
|
127
|
+
<sonic-button data-aria-label="Custom aria label" href="https://google.fr" type="primary" >
|
|
128
|
+
Button link with aria label
|
|
129
|
+
</sonic-button>
|
|
130
|
+
</code></pre>
|
|
131
|
+
<h2 id="custom-styles--active-states-with-tailwind">Custom styles & active states with tailwind</h2>
|
|
132
|
+
<pre><code><div formDataProvider="subscriptionData2">
|
|
133
|
+
<sonic-button
|
|
134
|
+
class="bg-neutral-100 transition-all text-center text-lg text-neutral-400 rounded-md min-w-[8rem] [&[active]]:text-danger-content [&[active]]:min-w-[13rem] [&[active]]:bg-danger [&[active]]:font-black [&[active]]:rounded-full"
|
|
135
|
+
variant="unstyled"
|
|
136
|
+
checkable unique
|
|
137
|
+
name="subscription"
|
|
138
|
+
value="premium"
|
|
139
|
+
type="default">
|
|
140
|
+
<span swap="off" class="inline-block py-2 px-3" >subscribe</span>
|
|
141
|
+
<span swap="on" class="inline-block py-2 px-3" >⭐ Premium</span>
|
|
142
|
+
</sonic-button>
|
|
143
|
+
</div>
|
|
144
|
+
</code></pre>
|
|
145
|
+
|
|
146
|
+
</article>
|
|
147
|
+
</main>
|
|
148
|
+
</body>
|
|
149
|
+
</html>
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<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">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>Captcha — Concorde</title>
|
|
7
|
+
<meta name="description" content="Captcha: Submit with captcha">
|
|
8
|
+
<meta name="keywords" content="Concorde, supersoniks, core/components/ui/captcha/captcha, captcha, Captcha, UI component, sonic-captcha, web component">
|
|
9
|
+
<meta name="concorde-doc-id" content="core/components/ui/captcha/captcha">
|
|
10
|
+
<link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/captcha/captcha.html">
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
<header>
|
|
14
|
+
<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>
|
|
15
|
+
</header>
|
|
16
|
+
<main>
|
|
17
|
+
<article>
|
|
18
|
+
<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>
|
|
19
|
+
<h1 id="captcha">Captcha</h1>
|
|
20
|
+
<pre><code><sonic-captcha formDataProvider="captchaTestDataProvider" key="6Leq5V0iAAAAAB-41DlWN335jDlcIuXmhNtdd00t">
|
|
21
|
+
<sonic-submit serviceURL="/docs-mock-api" endPoint="api/unknown" onclick>
|
|
22
|
+
<sonic-button class="mt-4">Submit with captcha</sonic-button>
|
|
23
|
+
</sonic-submit>
|
|
24
|
+
</sonic-captcha>
|
|
25
|
+
</code></pre>
|
|
26
|
+
|
|
27
|
+
</article>
|
|
28
|
+
</main>
|
|
29
|
+
</body>
|
|
30
|
+
</html>
|